Capturing Field Update Event for a JSP

ankur8819
Member • Nov 7, 2011

Capturing Field Update Event for a JSP

Hi,
I am working on a project where I need to do some task if any field is updated on a jsp.
One way could be take a hidden variable for every field which stores the previous value and then by comparing the previous value and the current value I can know if any field has been updated or not.
But keeping track of 20 fields on JSP like this is not neat. Also a part of JSP displays some fields that are displayed dynamically i.e. they come through a query .The number of rows returned by Select query determines the number of fields rendered on page,So when the page renders I will not know how many fields are there on JSP.

Other way that i thought of was

when the page has rendered create change event for every VISIBLE INPUT element except button in the DOM using JQUERY and if any one of the change event fires I set a variable which tells that any field has been updated.

Can anyone suggest some other approach that I can use?
Note that I need to do something in java if ANY field on the jsp is updated.

Thanks,
Ankur

Replies

Howdy guest!

Dear guest, you must be logged-in to participate on CrazyEngineers. We would love to have you as a member of our community. Consider creating an account or login.

Replies

ankur8819

Member • Nov 10, 2011

I was able to do it .Pasting the Js code below just for reference.
Steps :-
Call the saveInitialValues() function in document.ready() function.This will return an array containing values of all input variables other than buttons,hidden etc.

On Post of form call saveFinalValues() function It will create another array containing values of all input variables other than buttons,hidden etc on jsp.

Then call checkfieldupdated().This function returns 1 if any change has been made on JSP and 0 if not.

Let me know if anyone has issue understanding the logic below.

var initialValues;
var finalValues

function compareArrays(obj1,obj2)
{
if(obj1==null)
obj1len=0;
else
obj1len=obj1.length ;

if(obj2==null)
obj2len=0;
else
obj2len=obj2.length
if( obj1len==0 && obj2len==0){return true;}
if (obj1len != obj2len) { return false; }
var a = obj1.sort(),
b = obj2.sort();

for (var i = 0;i< b.length; i++) {
if (a !== b) {
return false;
}
}
return true;
}

function getAllInputFields(form) {
var tempArray=new Array();
var allfields=$('#'+form+' :input:not😀hidden,:submit,😛assword,:button)');
allfields.each(function(){

if($(this).get(0).type=='select-one')
{
tempArray.push($(this).val());
}
else if($(this).get(0).type=='select-multiple')
{
for(var j=0;j<this.options.length;j++)
{
$(this).get(0).options[j].selected=true;
}

tempArray.push($(this).val());
}
else if($(this).get(0).type=='radio')
{
if($(this).is(':checked'))
tempArray.push($(this).val());
}
else
{
tempArray.push($(this).val());
}

});
return tempArray;

}

function saveInitialValues()
{
initialValues=getAllInputFields('WISCTaskInstanceDetailsForm');

}

function saveFinalValues()
{
finalValues=getAllInputFields('WISCTaskInstanceDetailsForm');
}

function checkfieldupdated()
{
if(initialValues.length!=finalValues.length)
return 1;
else
{
for(var i =0 ;i< initialValues.length;i++)
{

if(typeof initialValues=='string')
{
if(initialValues!=finalValues)
{
return 1;
}
}
else if(typeof initialValues=='object')
{
if(!compareArrays(initialValues,finalValues))
{
//alert('Field Updated');
return 1;
}
}

}
}
return 0;
}

Are you sure? This action cannot be undone.
Cancel
ankur8819

Member • Nov 10, 2011

the smiley is actually "colon"password

ankur8819
I was able to do it .Pasting the Js code below just for reference.
Steps :-
Call the saveInitialValues() function in document.ready() function.This will return an array containing values of all input variables other than buttons,hidden etc.

On Post of form call saveFinalValues() function It will create another array containing values of all input variables other than buttons,hidden etc on jsp.

Then call checkfieldupdated().This function returns 1 if any change has been made on JSP and 0 if not.

Let me know if anyone has issue understanding the logic below.

var initialValues;
var finalValues

function compareArrays(obj1,obj2)
{
if(obj1==null)
obj1len=0;
else
obj1len=obj1.length ;

if(obj2==null)
obj2len=0;
else
obj2len=obj2.length
if( obj1len==0 && obj2len==0){return true;}
if (obj1len != obj2len) { return false; }
var a = obj1.sort(),
b = obj2.sort();

for (var i = 0;i< b.length; i++) {
if (a !== b) {
return false;
}
}
return true;
}

function getAllInputFields(form) {
var tempArray=new Array();
var allfields=$('#'+form+' :input:not😀hidden,:submit,😛assword,:button)');
allfields.each(function(){

if($(this).get(0).type=='select-one')
{
tempArray.push($(this).val());
}
else if($(this).get(0).type=='select-multiple')
{
for(var j=0;j<this.options.length;j++)
{
$(this).get(0).options[j].selected=true;
}

tempArray.push($(this).val());
}
else if($(this).get(0).type=='radio')
{
if($(this).is(':checked'))
tempArray.push($(this).val());
}
else
{
tempArray.push($(this).val());
}

});
return tempArray;

}

function saveInitialValues()
{
initialValues=getAllInputFields('WISCTaskInstanceDetailsForm');

}

function saveFinalValues()
{
finalValues=getAllInputFields('WISCTaskInstanceDetailsForm');
}

function checkfieldupdated()
{
if(initialValues.length!=finalValues.length)
return 1;
else
{
for(var i =0 ;i< initialValues.length;i++)
{

if(typeof initialValues=='string')
{
if(initialValues!=finalValues)
{
return 1;
}
}
else if(typeof initialValues=='object')
{
if(!compareArrays(initialValues,finalValues))
{
//alert('Field Updated');
return 1;
}
}

}
}
return 0;
}

Are you sure? This action cannot be undone.
Cancel