I'm passing list from java action class to jsp file through the session variable and i need set that list to the hidden input field and get that list to the jquery function I used following method to do that
I use this code bock for set list to the input field
<c:if test="${not empty sessionScope.myList}">
<c:forEach items="${sessionScope.myList}" var="item" varStatus="itemLoop">
<input class="myClass" type='hidden' value='${item}'/>
</c:forEach>
</c:if>
jquery method
$(document).ready(function () {
$('input.myClass').each(function() {
// do some work
});
}
But problem is its working first time only, my list values are changed by ajax call, but after changing list size and value it's not set the value accordingly.
Fist time created input fields are also there when I set the value second time. I think my method is not the correct way to do this, if any one know the better way to do this please help me
Thank you..!
But problem is its working first time only, my list values are changed by ajax call, but after changing list size and value it's not set the value accordingly fist time created input fields are also there
You need to remove the created elements first:
$("input.myClass").remove();
Or if you know the container of your elements you can do:
var $parent_container = $("your-selector-for-the-container");
$parent_container.empty();
I think my method is not the correct way to do this if any one know the better way to do this please help me
I'm normally not a fan of global variables, but in your case a global variable might be better than keeping this info (your list items) in the DOM.
Related
I wanted to store all my clicked input accordions(<input type="checkbox">) into json object, I have tried it but it is storing/taking the last input accordion clicked event only, it is not storing/taking all the input clicked accordions that is whatever I click on any accordion(of <input type="checkbox">) that should store into json object using either Javascript or jQuery ?
I am not sure where I am doing wrong ? Please help me regarding this ? Thanks in advance. Sample fiddle.
Because you are doing submitButtonValue[name] = $(this).val(); and the name you are getting it from $(this).attr('name'); on click of checkbox which is same for all the checkboxes. So everytime it replaces the value since object will have only one name contained. I would suggest you to either use different names for each checkbox or find some other way to uniquely store your checkbox values.
A Demo here
I've seen a few articles here trying to bind computed fields but my preferred solution; getComponent is just not working for me. I'd rather not have hidden "real" fields. Here's what I have. A computed VAT Tax percentage field called VP
<xp:text escape="true" id="VP" value="#{FInvoiceDoc.VP}" style="text-align:right">
<xp:this.converter>
<xp:convertNumber pattern="0.00"></xp:convertNumber>
</xp:this.converter>
</xp:text>
Here is one of the calculations where I set the value of this field;
XSP.getElementById("#{id:VP}").innerHTML = tmp.toFixed(2);
tmp calculates correctly, VP displays the correct expected value on the page.
Then in my querySaveDocument event, I do the following
var VP = getComponent("VP").getValue();
FInvoiceDoc.replaceItemValue("VP",VP);
and what gets stored is a Null value. I've even confirmed that the VP variable is null by doing a "Print (VP)" command after setting the VP variable then checking the log. There's got to be something I'm missing.
At page submit you don't get a computed text field's value back to server as it is read only.
You are looking for a solution where you can:
show a document's field in read mode
set new values to this field on client side with CSJS
save the value back to document's field on submit
The first two points working already with your solution.
The third point you can achieve with adding an input text field "VPdoc" which is bound to your document's field "VP" and hidden with style="display:none".
<xp:inputText
id="VPdoc"
value="#{FInvoiceDoc.VP}"
style="display:none">
<xp:this.converter>
<xp:convertNumber pattern="0.00"></xp:convertNumber>
</xp:this.converter>
</xp:inputText>
At submit copy the current value (innerHTML) from computed text field "VP" to input text field "VPdoc" using the following CSJS code in submit button:
<xp:this.script><![CDATA[
XSP.getElementById("#{id:VPdoc}").value =
XSP.getElementById("#{id:VP}").innerHTML
]]></xp:this.script>
This way the value which was set on client side to field "VP" is saved to document.
You do NOT assign a value, but replace the html- representation by some html code. With that you simply break the element and kind of "convert" it to a stupid div (sorry, don't know how to explain better)...
Never mess around with the frontend: the element is bound to an item in your document. Modify that value, and the element representing it will represent the change.
And: you do not need that lines of code in querysavedocument to save back the value... This will be done automatically, that's what binding (value property of element) is for...
Perhaps, instead of manipulating the innerHTML, you used
getComponent("VP").setValue(tmp.toFixed(2));
Would that work? You'd be setting the value of the component then, I think.....
I have a problem. I have a user control which contains multiple textboxes. When I update a value in one textbox it should calculate value and fill the value in another textbox automatically. I am writing Javascript code in Usercontrol.
When I change the value in the textbox, I am trying to get elementIDs of other textboxes.It shows me an error. It looks to me the elements are not present or they are somewhere else.
Can anyone give me a simple example?
Any help would be appreciated.
if you use jQuery...
var ids = [];
$('input[type=text]').each(function() {
ids.push($(this).attr('id'));
});
ids is now an array of all the ids of the inputs that have the type of text
I have a search form that has different elements in it, checkboxes, selects, text fields etc. Each change is accompanied by an ajax call that gets the number of results as a sort of counter. I would like to reset only the previous element that caused the counter to return a value of 0.
I was thinking about keeping track of each change in a variable, and each time the counter evaluates to 0, I would then reset the element that caused the change. I however fear that this could force me to handle all the different elements differently with a lot of code and jumping around.
Is there a possible more elegant solution to the problem that anybody can think of? I would appreciate the help.
I cannot comment your question, but : if I understand correcty, there is a big form, and each change on any element, triggers an ajax call, that returns a resultset.
If this resultset size is zero, then, you want the form to reset to previous value.
That would mean, that only the last-changed value has to be tracked down, and reset ?
In this case, your onchange event callback should use this value to get current form element value, and ID. Then, as the resultset comes back, set back the stored value to that element if there are no rows.
Otherwise, if the form is managed globally, you could always store it with a .clone() call, then .remove() it and .insert() the clone back if the resultset is empty.
PS : i know this solution not really elegant :)
Your AJAX module could return a JSON-Encoded string with the data causing this event to occur (PHP-Function: JSON_encode) and from there on, you can cycle through the erroneous values resetting them and displaying further informations. i.e. "Your E-Mail seems to be invalid".
PHP: See JSON_encode
JavaScript: See getElementsByTagName('input') (or textarea or select)
Note: In case of a select item, you may rather want to change the Attribute "selectedIndex" than "value".
I solved the problem by recording each change to the form with
$("#form_id").on("change", function(event) {
//Event bubbling
type = $(event.target).get(0).type;
selector = $(event.target);
}
Then using the Strategy design pattern (Javascript Strategy Design Pattern), I reset each possible field type accordingly. Example for text field,
var Fields = {
"text": {
resetAction: function(fieldSelector) {
fieldSelector.val('');
}
}
};
//To call the reset action for the type of field,
Fields[type].resetAction(selector);
I had to trigger a change event for hidden fields to have their changes also bubble.
I am using Jsp, Structs. From a parent window (e.g)parent.jsp, I invokes child.jsp, which has a list of checkbox values. I select more than one values, then put it in a arraylist and send back to parent.jsp and store it in a textarea.
Now If i want to select some more values from child.jsp. When i again invokes child.jsp, the checkboxes i already checked will be checked there and i dont want the empty unchecked boxes.
Could someone help me in this.......If u send some sample code means its very useful.
Thanks in advance.....
Aadhira.
As I understand, when you go to the child.jsp for the second time you need to preserve the checked checkbox values. The only solution i see for this is pass these checked box parameters to the child.jsp form.