Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

Compare data change during form resubmission

Posted on 2013-11-15
7
Medium Priority
?
280 Views
Last Modified: 2013-12-03
When a HTML page the page is closed, we need to alert saying

"There are some data changed which is not saved, do you want to close?"

Is there JQuery built in method to know whether the form data is changed.

or need to follow a complex way,

1. Introduce a local java script variable and capture all the form data in onload event.
2. While Close the window, Compare the local java script variables and form input values, if there is a change alert.
0
Comment
Question by:ZoniacUser
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 3
7 Comments
 
LVL 44

Assisted Solution

by:Chris Stanyon
Chris Stanyon earned 1002 total points
ID: 39651071
I don't know of a built in method, but you could use the jQuery change event.

Create a global variable:

var changed = false;

Bind the change event to each of your form elements:

$('input').change(function() {
   changed = true;
});

And then on close, check it. You'd need a way to reset it back to false, probably on the form submit button.
0
 
LVL 33

Assisted Solution

by:Big Monty
Big Monty earned 498 total points
ID: 39651444
you can do something like this:

$("form :input").change(function() {
  $(this).closest('form').data('changed', true);
});
$('#mybutton').click(function() {
  if($(this).closest('form').data('changed')) {
     //do something
  }
});

Open in new window


This attaches a change event handler to the inputs on the form, if any of them changes, it uses .data() to set a changed value to true, then we just check for that value on the click
0
 

Author Comment

by:ZoniacUser
ID: 39692138
I've requested that this question be deleted for the following reason:

I dont want
0
Tutorials alone can't teach real engineering

So we built better training tools.

-Hands-on Labs
-Instructor Mentoring
-Scenario-Based Tests
-Dedicated Cloud Servers

All at your fingertips. What are you waiting for?

 
LVL 44

Expert Comment

by:Chris Stanyon
ID: 39691968
What do you mean you 'don't want'. You asked a question, and you got some answers. It's considered bad manners to just delete the question, without ever interacting with the Experts that tried to help you!!
0
 

Author Comment

by:ZoniacUser
ID: 39691979
This was done by mistake, we apologize for this.
0
 

Author Comment

by:ZoniacUser
ID: 39691985
We were waiting for a better solution, Both solution given works great.

But in here we are trying to say.

Ex.,

1. Say you have a page, which has a text field
2. The Text field is populated as "Java Developer" while page is loaded
3. The user removes the Java Developer and again types Java Developer
4. According to code the field is changed
5. But According to user the form is not changed.

We just want to know whether there is any built in solution for this in JQuery or to follow the traditional way (What we have done now)

1. Introduce a local java script variable and capture all the form data in onload event.
2. While Close the window, Compare the local java script variables and form input values, if there is a change alert.
0
 
LVL 44

Accepted Solution

by:
Chris Stanyon earned 1002 total points
ID: 39692047
There is no single-function way built in to do this - but it can be done :)

You'll just have to write some code to manage it. The principal is that on page load, you store the default values of each form field, and then on page close you check each of the form values against the stored defaults - if they differ you create an alert!
0

Featured Post

The top UI technologies you need to be aware of

An important part of the job as a front-end developer is to stay up to date and in contact with new tools, trends and workflows. That’s why you cannot miss this upcoming webinar to explore the latest trends in UI technologies!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

The most up-to-date version of this article is on my Blog https://iconoun.com/blog/
Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

715 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question