homepage Welcome to WebmasterWorld Guest from 54.227.20.250
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

    
Ajax with php and mysql, easier wiew on resubmit
helenp

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 4644541 posted 7:41 pm on Feb 12, 2014 (gmt 0)

Hi,
I have a form that uses Ajax.
On submitting the form a message comes up after connecting with the database.
This works very well.
However when the form is resubmitted and the new message is similar, as the page does not reload, it can be hard to see that the message has been updated. Could seem like the resubmit has not been done.

I wonder if there is some way to highlight, change colors etc. when a result is displayed.
Any idea of improving this?
Thanks

 

daveVk

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4644541 posted 5:12 am on Feb 13, 2014 (gmt 0)

Consider removing message when any form field is changed ?

helenp

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 4644541 posted 9:07 am on Feb 13, 2014 (gmt 0)

Consider removing message when any form field is changed ?


Yes maybe that's a good idea,
there are only 2 fields that can be changed, and its an option field with dates.
How can this be done?
I have a div where the result from the php page are shown
inside a function.
The script does not clean the inputs wich is good in this case.
No laughing please ;).
Just guessing, not any knower at javascript:
I should put an id on the inputs, then
do something like this after the message has been displayed:

if (document.solicitud.day.options == "changed - newvalue")
{
document.getElementById("messagediv").style.display = "none";

To know if an option has been changed what to use?

Then, if functionsubmit display = "block"

daveVk

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4644541 posted 12:07 pm on Feb 13, 2014 (gmt 0)

You are on the right track

In javascript include

function dataChanged() {
document.getElementById("messagediv").style.display = "none";
}

on both fields HTML add onchange

<select ... onchange="dataChanged()" ... >

then prior to where you put message up

document.getElementById("messagediv").style.display = "block";

helenp

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 4644541 posted 12:46 pm on Feb 13, 2014 (gmt 0)

Wow, that works like a charm!
Thanks a lot, you saved me some hours searching.

I added it in this order:

function dataChanged() {
document.getElementById("resultado").style.display = "none";
}

function sendform(){
document.getElementById("resultado").style.display = "block";
divResultado = document.getElementById('resultado');

Always wanted to study javascript but no time and thought very complicated.
However as I now uses it a lot understands more of it, and its really fascinating.

Suppose no problem as the date fields I also use on same pages for another purpose.
Not to have doubble and update doubble I added the onchange="dataChanged()" to the fields, and as the other app does not call the function its ok and no problem with usability, semanthics etc.

daveVk

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4644541 posted 10:37 pm on Feb 13, 2014 (gmt 0)

Glad it worked, no need to use getElementById multiple times in sendform, also use 'var' on variables local to a function such as divResultado.

function sendform(){
var divResultado = document.getElementById('resultado');
divResultado.style.display = "block";
...

helenp

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 4644541 posted 10:46 pm on Feb 13, 2014 (gmt 0)

function sendform(){
var divResultado = document.getElementById('resultado');
divResultado.style.display = "block"

Looks nicer, thanks

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved