I have select tag outside the form , in onchange event of select i publish the listenTopics of anchor tag and get the result in json which is correct but it replaces the form with json data I need to update the form. Any idea what might be wrong here or there is any other way to do this.
<script type="text/javascript">
function reloadForm() {
$.publish('reloadFormList');
}
</script>
<div id="body" style="text-align: center;width: 100%;">
<s:form id="formSelect" style="margin-top:20px;">
<s:select list="model.classList" name="model.selectedID"
listKey="classID" listValue="className" headerKey="-1"
headerValue="" theme="simple" label="Class"
style="margin-bottom:10px;" onchange="reloadForm();" />
<sj:a formIds="formSelect" href="getEmailSett" targets="form"
style="display:none;" listenTopics="reloadFormList"></sj:a>
</s:form>
<s:form id="form">
<s:checkbox label="OPtion1" title="OPtion1" name="model.chk_option1"
style="margin-top:20px;"></s:checkbox>
<s:checkbox label="OPtion2" title="OPtion2" name="model.chk_option2"
style="margin-top:20px;"></s:checkbox>
<sj:submit id="formSubmit" href="mysubmit" value="Update"
indicator="indicator" button="true" />
</s:form>
</div>
I just tell you what are you doing wrong because a lot of questions posted with the same topic. A common mistake is to use targets
for json results. targets
should be used to load html/javascript content. If you want to handle json result, then you shouldn't write such ugly code
<sj:a formIds="formSelect" href="getEmailSett" targets="form"
style="display:none;" listenTopics="reloadFormList"></sj:a>
In the reloadForm()
you should write a normal ajax call via $.ajax()
or $.getJSON()
and in the callback success function used to modify your DOM.
If you still continue to use targets
then you should change result of the triggered action to dispatcher
to return html/javascript content.