We Keep Coding

How to get an input text value using formID?

I have two form on same page. There is a text field with same name in both of the forms.
I am tried to read the value of the text field from one of the two forms. if I am trying to read the value using below code i am getting the value . But I am not sure from which forms it is returning the value.
document.getElementById("groupId")
Now if I am trying to read the value from specific form using below code I am receiving the error.
document.forms["form1"].getElementById("groupId")
Please suggest whats wrong I am doing and how can we read the value of a control ?
I can use both javascript and jquery.

Since you're using jQuery you could do :
$('[name=form_name]').find('#field_id');
Your case e.g :
$('[name=form1]').find('#groupId');
Using pure js you could do it like :
document.form_name.getElementById("field_id");
Sample of your case :
document.form1.getElementById("groupId");
Hope this helps.

You can do the following with jquery.
var element = $(document.forms["form1"]).find('#groupId')
And to get the text value you can use the val function.
var text = element.val();

if i am trying to read the value using below code i am getting the value . But i am not sure from which forms it is returning the value.
This means you have multiple elements with same id which is a big NO. id's are supposed to be unique in your entire HTML. If for some reason you want to use same id on multiple elements to work with JavaScript be aware the same task is possible by assigning same class to the elements and accessing by class
Having said that, Change your HTML to not have duplicate id and change them to have a common class. Now with this structure you can access the element starting from your from like below
$('form[name="form1"]').find('input.ClassName').val()
Also for info purpose: If you have multiple elements with same id in your HTML and when you try to access by id the element which is placed in top parsing from top will be selected always.

The W3C standards for HTML require the id to be unique in a document.

What is a simple way to make "null" not to render?

I have created a simple polymer element with no js that has attributes in it. When the attribute is not called it shows "null".
http://jsbin.com/wakal/1/
How do I tell the element not to show null?. If the attribute is left blank I do not want anything to show up?

Normally to use default values you need to use the script and initialize the properties there.
See http://www.polymer-project.org/docs/polymer/polymer.html#default-property-values
Alternatives are to use
{{propname?propname:'default value'}} or
{{propname||'default'}}

Dynamically give HTML element a custom attribute

Is it possible to give a HTML element a new custom attribute?
You know how a "img" html element has the attribute .src:
imgEle.src = "";
Can I dynamically give a HTML element my own custom attribute .animationInterval? Is it as simple as this?...
imgEle.animationInterval = setInterval(...,10);
Maybe I do it the xml kindof way?...
imgEle.setAttribute("animationInterval", setInterval(...));
Whats the best way to do this?

The best way is to use html5 data- attributes:
$(imgEle).attr("data-animateinterval", "12");
Which can then be read back with
$(imgEle).data("animateinterval");
Which of course can also be added directly to your markup
<img src="foo.png" data-animateinterval="12" />
Also, if you're not concerned about whether a new attribute is added to the actual html element, but just want some arbitrary data associated with it, you can simply do this:
$(imgEle).data("animateinterval", "12");
And retrieve it like this:
var animateInterval = $(imgEle).data("animateinterval");
Note however that as Esailija explains, this may or may not actually add a new attribute to your element; it may just store this data internally. If that's not a concern for you, and I can't think of any reasons why it should be, then you may prefer this more succinct syntax.
To be clear, no matter which way you store it, $(imgEle).data("animateinterval"); will still work just fine.

The first way (element.something) sets a property and can be anything.
Th second way (element.setAttribute) sets an attribute, which must be a string (or serialisable as one via its toString() method).
So in this case either way works, but I would recommend the first.

HTML5 custom attribute updated value

How do i get the value of an html5 attribute using jQuery ?
<button data-direction="next" data-next="2"></button>
I want to be able to get the newest set value of data-next.
When i change the value dynamically using javascript and then try to get it using
$('[data-direction="next"][data-next]').data('next'),
it always returns the data as set when loading the page not after being updated - in this case 2.

$('[data-direction="next"][data-next]').attr('data-next') should work..

I concur with #Pierre. Use the attr() method to retrieve the desired value.
A point to note, your selector could turn out to be slower. Check this article out.

Add some properties to a <div> element

I want to add some properties to a <div> element. All of the below works except for the .data(). I cannot see it appear in Firefox/Firebug.
$('#menu-container')
.css('background-image','url("'+big_image+'")')
.addClass('click_2')
.data("new_link", "new_link.html")
.css('z-index',"99");
Am I doing it wrong?

data is not just any ordinary attribute you can add, it is a way to attach objects and data to DOM elements. You can't see it in the HTML source or in Firebug, but you can query it using .data()
The data itself is not stored on the element. It's actually stored in $.cache

.data() is working but it won't show up as an element's attribute.
If you wanted to see it working you can try console.log($('#menu-container').data('new-link'));
If attributes are what you want then you can do .attr('new-link','new-link.html')

Use
$('#menu-container').attr('data-new_link','new_link.html');
it will appear in firebug, and you can also use the expected jQuery behavior
$('#menu-container').data('new_link');
to retrieve the value stored..
But there is really no need to do it this way. It gets stored at the .data() collection, regardless of being added as an attribute to the DOM element..