Develop Reference

How to get the value of data attribute using JQuery in asp.net core?

I want to get the value of the custom attribute by jquery.
I use this code to do that but in console it show "undefined":
var correct = $("div").data("correct");
this is the html:
<div data-correct="#classCorrect.Answer">....</div>
also, I used "attr" to do that but that was the same too and shows "undefined".
And I don't want to use "id" for the selector.
I want it to show 3 as it is in "#classCorrect.Answer".

use .data() if you use newer jQuery >= 1.4.3 and the part after data- must be lowercase, e.g. data-idNum will not work, but data-idnum will.
Use attr:
var correct = $("div").attr('data-correct');

I am sure that you have several divs in your html so you have to assign id to your div at first:
<div id="correctAnswer" data-correct="#classCorrect.Answer">....</div>
after this you can get data attribute value using .attr:
var correct = $('#correctAnswer').attr('data-correct');
or if you use newer jQuery >= 1.4.3 you can try .data
var correct = $('#correctAnswer').data('correct');

If there are serverl divs with the data-correct attribute, you should give them the same class or name
Such as:
<div class="test" data-correct="1">A</div>
<div class="test" data-correct="2">B</div>
<div class="test" data-correct="3">C</div>
And when you use the class or name selector, the result is an array of these elements, you should traverse it to get each element then get its attribute value.
$(function () {
var datalist = $(".test");
$.each(datalist, function (i,value) {
console.log($(value).data('correct'));
})
})

javascript document.forms[0] and document.<formname> have different elements

I am trying to implement client side validation in Struts 2. my theme is xhtml. The javascript generated is not able to validate my code. After debugging , I found that Struts is using the following notation to refer the elements.
form = document.getElementById(<form id>);
service = form.elements['service'];
the point is that service is coming as undefined.
when I checked that form.elements is null; However if I access form using document.formname i am able to see the fields in elements collection.
I am thinking document.forms[0] is returning the same object as document.getElementById(formid). What is the difference?

The form element can access fields by name, for this purpose you should get the form element. You can do it in many ways, use document.getElementById() or document.forms[], or $("#formid"). Whatever way you choose doesn't matter. Just note that a document can contain many forms, so you should reference a correct one. Getting form element by id returns an element that has an id attribute, getting it by the index in the forms property you should know the correct index. Once you get the form element you can reference input fields by name. For example
<form id="formid">
<input name="service">
</form>
<script>
var v = document.getElementById("formid")['service'];
</script>

pass attribute from Java to JavaScript

In my Java Class I added a variable:
model.addAttribute("pageID", "dashboard");
Inside JSP I can easily call that variable with ${pageID}. But is there a way I can call that variable directly in JavaScript? I tried all other suggestion I found over the internet, such as simply writing var value = "${pageID}" but that doesn't work.
Any suggestions ?

Have u tried this?
var value = "<%= pageID %>";

Java custom tag with JS

I have custom tag which contains form with text input and submit. I want to validate this text input using JS, so my custom tag output should look like:
<script type="text/javascript">
function validate(form) {
var text = form.textInput;
// validation code
}
</script>
<form onsubmit='return validate(this);'>
<input type='text' name='textInput'/>
<input type='submit'/>
</form>
(Note, this code simplified!)
My problem appears when I want to use this tag twice or more times at page - I want to print form at page again, but not JS validation code! Validation code must be unique at the page. How can I archive that? My custom tag extends javax.servlet.jsp.tagext.TagSupport

I found the most suitable solution for me.
Class javax.servlet.jsp.tagext.TagSupport contains protected field pageContext which presents... page context! I can easily access context attributes of javax.servlet.jsp.PageContext. So, I put next code in my custom tag:
public int doStartTag() throws JspException {
if (pageContext.getAttribute("validated") == null) {
// validation code writing
pageContext.setAttribute("validated", true);
}
...
}
If condition would be reachable only once per page rendering.
Hope it would be useful for someone.

I suggest you to try to embed that JavaScript function in some .js file an import that file. If you don't want to do that, for some reason you should try to define that function dynamically, if it is not defined:
if (typeof window.validateMyForm === 'undefined') {
window.validateMyForm = function(form) {
var text = form.textInput;
// validation code
}
}
As you guess this should define function only if it is not already defined.
First answer is correct, but that means that programer must know where in code are already inserted custom tags and according to that this whether to set that parameter to true or false. And what about code changes, you will have to always go thought whole page and revise all used tags on a page.

Make the custom tag to accept a parameter that toggles the validation on or off, and of course have it generate different code depending on the value of the parameter.

getting hidden fields value

I am working on a Struts2 application. I am setting the value of a hidden field in JSP with the purpose to access it by JavaScript.
My JSP code:
<s:iterator value="collegelist">
<tr>
<td align="center"><s:property value="collegename"/></td>
<s:hidden name="hiddenname" key="collegename" />
</tr>
</s:iterator>
My JS code:
var myForm = document.frmAction;
var text = myForm.hiddenname.value;
alert("hidden field text is:" + text);
The alerts shows a blank value.
What is the cause and how can I solve this?

Try
element = document.getElementsByName("hiddenname");
alert(element[0].value);

You generate multiple fields having the same name, since your code is inside a s:iterator tag. You should obviously have such a loop in your Javascript as well :
var hiddenFields = document.getElementsByName("hiddenname");
for (var i = 0; i < hiddenFields.length; i++) {
alert("hidden field text is::" + hiddenFields[i].value);
}
Also, verify the the value is not blank in the generated HTML, and that the hidden fields'a name is hiddenname.

I tried your code and it surely works.. problem is somewhere in your server code itself..
Look here: http://jsbin.com/ajajo4/2/edit

Make sure you have only one form with the name "frmAction" and only one hidden field with the name "hiddenname". If you have multiple, you'll get an array instead of a single value.

The root of the problem is that you are inside of an iterator. Struts updates the name for you in order to correctly hook everything up. If you pull up your page and view source, your hidden field will probably look something like this:
<input type="hidden" name="collegelist[0].hiddenname" value="thename"/>
Regardless, if you want the retrieval by name to work, do not trust the name that you supply to a struts tag. Always pull up the generated source and look at what name the field actually has.