save all controls in ajax tab panel

There is a concept in javascript. When a form is loaded, each control will have property called defaultxxx. For example, textArea it is defaultValue and so for all other controls.

So, when you are moving out of the tab you need to call the javascript function below:

// * Returns true if any field in the form has changed.

function isFormChanged(form){

var isChanged = false ;

for (var i = 0; i< form.length; i++)

{ switch(form.elements[i].type)

{

case "text" :

isChanged = isTextChanged(form.elements[i]) ;

break;

case "select-one" :

isChanged = isSelectChangedOne(form.elements[i]) ;

break;

case "select-multiple" :

isChanged = isSelectChangedMul(form.elements[i]) ;

break;

case "radio" :

isChanged = isRadioChanged(form.elements[i]) ;

break;

case "checkbox" :

isChanged = isCheckChanged(form.elements[i]) ;

break;

case "textarea" :

isChanged = isTextAreaChanged(form.elements[i]) ;

break;

}

if (isChanged)

{ break ;

} }

return isChanged ;

}

// ************************************************************************

// * Returns true if the select-one value has changed, else returns false.

// ************************************************************************

function isSelectChangedOne(selectbox)

{ var len = selectbox.options.length ;

var defaultIndex = -1 ;

for (var i = 0 ; i < len ; i++)

{if (selectbox.options[i].defaultSelected)

{defaultIndex = i ;

break;

} }

if (selectbox.size <= 1)

{if (defaultIndex == -1 && selectbox.selectedIndex == 0) return false;

return (defaultIndex == selectbox.selectedIndex ) ? false : true ;

}

else

{return (defaultIndex == selectbox.selectedIndex) ? false : true ;

} }

// ****************************************************************************

// * Returns true if the select-multiple value has changed, else returns false.

// ****************************************************************************

function isSelectChangedMul(selectbox)

{ var len = selectbox.options.length ;

for (var i = 0 ; i < len ; i++)

{ if (selectbox.options[i].selected != selectbox.options[i].defaultSelected )

{ return true ;

} }

return false;

}

// **********************************************************************

// * returns true if the text value has changed, else returns false.

// **********************************************************************

function isTextChanged(textBox)

{ return (textBox.value == textBox.defaultValue) ? false : true ;

}

// ******************************************************************************

// * Returns true if the radio checked condition has changed, else returns false.

// ******************************************************************************

function isRadioChanged(radioButton)

{ return (radioButton.checked == radioButton.defaultChecked) ? false : true ;

}

// *****************************************************************************

// * returns true if checkbox checked condition has changed, else returns false.

// *****************************************************************************

function isCheckChanged(checkBox)

{ return (checkBox.checked == checkBox.defaultChecked) ? false : true ;

}

// **********************************************************************

// * returns true if the select value has changed else returns false

// **********************************************************************

function isTextAreaChanged(textAreaField)

{ return (textAreaField.defaultValue == textAreaField.value) ? false : true ;

}

3 Replies

Know the answer? Post it — somebody with the same question will find it here.

Akkiraju Ivaturi13y ago
Accepted answer
There is a concept in javascript. When a form is loaded, each control will have property called defaultxxx. For example, textArea it is defaultValue and so for all other controls.

So, when you are moving out of the tab you need to call the javascript function below:

// * Returns true if any field in the form has changed.
function isFormChanged(form){
var isChanged = false ;
for (var i = 0; i< form.length; i++)
{ switch(form.elements[i].type)
{
case "text" :
isChanged = isTextChanged(form.elements[i]) ;
break;
case "select-one" :
isChanged = isSelectChangedOne(form.elements[i]) ;
break;
case "select-multiple" :
isChanged = isSelectChangedMul(form.elements[i]) ;
break;
case "radio" :
isChanged = isRadioChanged(form.elements[i]) ;
break;
case "checkbox" :
isChanged = isCheckChanged(form.elements[i]) ;
break;
case "textarea" :
isChanged = isTextAreaChanged(form.elements[i]) ;
break;
}
if (isChanged)
{ break ;
} }
return isChanged ;
}

// ************************************************************************
// * Returns true if the select-one value has changed, else returns false.
// ************************************************************************
function isSelectChangedOne(selectbox)
{ var len = selectbox.options.length ;
var defaultIndex = -1 ;
for (var i = 0 ; i < len ; i++)
{if (selectbox.options[i].defaultSelected)
{defaultIndex = i ;
break;
} }
if (selectbox.size <= 1)
{if (defaultIndex == -1 && selectbox.selectedIndex == 0) return false;
return (defaultIndex == selectbox.selectedIndex ) ? false : true ;
}
else
{return (defaultIndex == selectbox.selectedIndex) ? false : true ;
} }
// ****************************************************************************
// * Returns true if the select-multiple value has changed, else returns false.
// ****************************************************************************
function isSelectChangedMul(selectbox)
{ var len = selectbox.options.length ;
for (var i = 0 ; i < len ; i++)
{ if (selectbox.options[i].selected != selectbox.options[i].defaultSelected )
{ return true ;
} }
return false;
}
// **********************************************************************
// * returns true if the text value has changed, else returns false.
// **********************************************************************
function isTextChanged(textBox)
{ return (textBox.value == textBox.defaultValue) ? false : true ;
}
// ******************************************************************************
// * Returns true if the radio checked condition has changed, else returns false.
// ******************************************************************************
function isRadioChanged(radioButton)
{ return (radioButton.checked == radioButton.defaultChecked) ? false : true ;
}
// *****************************************************************************
// * returns true if checkbox checked condition has changed, else returns false.
// *****************************************************************************
function isCheckChanged(checkBox)
{ return (checkBox.checked == checkBox.defaultChecked) ? false : true ;
}
// **********************************************************************
// * returns true if the select value has changed else returns false
// **********************************************************************
function isTextAreaChanged(textAreaField)
{ return (textAreaField.defaultValue == textAreaField.value) ? false : true ;
}
Akkiraju Ivaturi13y ago
Happy to know that....
mohan13y ago
Thanks Bro..
Its Working perfectly for me.

Thank you very much ..