We Keep Coding

Read attribute values in reactive form submit

I have a reactive form containing input having attribute in it:
<input type="text" [attr.data-challengeId]="value.id" [formControlName]="value.label">
On submitting form I get only value, but I need the attribute value too.
Tried adding tag reference #inputTag, but that doesn't help.
Let me know how I can read the attribute inside tags.

One solution to our problem is to create input hidden
<input type="hidden" name='data-challengeId' [value]="value.id" ngModel>

Setting the value of multiple inputs with the same id using jQuery?

Considering the following HTML:
<form id="upvoteForm" method="post" action="/post/upvote">
<input type="text" name="post_id" id="post_id"/>
</form>
<form id="downvoteForm" method="post" action="/post/downvote">
<input type="text" name="post_id" id="post_id"/>
</form>
<input type="hidden" id="_postid" value="1"/>
I'm trying to set the two input fields with the name post_id to to value from _postid using this JavaScript and jQuery:
$(document).ready(function() {
$('#post_id').val($('#_postid').val());
});
However, as you can see in this jsFiddle, it's only setting the value of the first one. How do I set the value of both of them? I thought the selector would end up grabbing both.
Now, I realize you might be wondering why I have two forms on this page. The basic reason is I have button inputs that I've styled the way I want but then I use the onclick to call the submit of the appropriate form here. I am ultimately going to be leveraging AJAX here, but that's coming later.

id is always unique. you cannot select 2 elements with same id. select by name
$(document).ready(function() {
$('input[name=post_id]').val($('#_postid').val());
});

Having two HTML elements with the same ID is illegal and will cause undefined behavior such as what you're experiencing. Using the same name is valid, however. Therefore you could use a selector like $('form > input[name=post_id]'), which would look for an input inside of a form with the name attribute set to post_id.

How send a form with Javascript when input name is "submit"?

Question: How can you send a form with Javascript if one form input has the name submit?
Background: I am redirecting the user to another page with a hidden HTML form. I cannot change name on the (hidden) inputs, since the other page is on another server and the inputs need to be exactly as they are. My HTML form looks like this:
<form id="redirectForm" method="post" action="http://www.example.com/">
<input name="search" type="hidden" value="search for this" />
<input name="submit" type="hidden" value="search now" />
</form>
I use the following javascript line to send the form automatically today:
document.getElementById('redirectForm').submit();
However, since the name of one input is "submit" (it cannot be something else, or the other server won't handle the request), document.getElementById('redirectForm').submit refers to the input as it overrides the form function submit().
The error message in Firefox is: Error: document.getElementById("requestform").submit is not a function. Similar error message in Safari.

Worth noting: It's often a lot easier to just change the input name to something other than "submit". Please use the solution below only if that's really not possible.
You need to get the submit function from a different form:
document.createElement('form').submit.call(document.getElementById('redirectForm'));
If you have already another <form> tag, you can use it instead of creating another one.

Use submit() method from HTMLFormElement.prototype:
HTMLFormElement.prototype.submit.call(document.getElementById('redirectForm'));

Simplest way to read INPUT outside a FORM

I have a simple form as
<form method="post" action="target.php">
<input class="button" type="submit" value="Submit" />
</form>
I want to read checkboxes from atable. Thus, checkbox input is outside the <form> as
<input type="checkbox" name="tick[]" value="'.$value.'" />
What is the simplest jQuery action to read the values checked and send them via POST by the form?
P.S. Since I have form for each row in the table, I cannot put the entire table within <form> tag.

Try this - I didn't test it though.
$("input[name^=tick]:checked").each(function() {
$(this).val() // this line should contain the value of each checked checkbox, you can use it as you want
});

You can get the entire for in a single object / array by using jQuery serialize() or serializeArray() method :
alert($('#<idOfForm>').serialize()); // will alert all form values in key / value string
or to submit the form using $.post() :
$.post("target.php", $("#<idOfForm>").serialize());

JQuery - Serialize() a object that isn't a form but it's inside and part of a form

I'm trying to serialize some contents inside of a form:
<form>
<input ...>
<input ...>
<div id=div1>
<input name=input1 ...>
<input name=input2 ...>
</div>
</form>
<script>
jQuery("#div1").serialize();
</script>
In this code serialize() function doesn't serialize the input1 and input2. Even I tried
jQuery("<form>" + jQuery("div1").html() + "</form>").serialize()
And it does serialize the inputs but all the values are Empty! it's like it doesn't assign values that user entered: input1=&input2=
Is there any solutions out there?
(The reason I need to do this is that this page is a ASP.NET page since ASP.NET standard is a single form based so I have to deal with this situation)

Better solution is to use the :input selector since it gets all of the form elements
jQuery('#div1 :input').serialize();

I believe this will work:
jQuery('#div1 input').serialize()