Develop Reference

How to change the value of input type in html?

I have a simple html form i.e.
<form action="https://www.sandbox.paypal.com/cgi-bin/webscr" method="post" target="_top" id="registration-form">
<input type="text" class="form-control" name="form-reg-fullname" data-form-field="Name" id="form-reg-fullname">
<input type="hidden" name="return" value=""/>
</form>
in <script> tag I am doing validation and changing the value of return:
<script>
$('#registration-form').submit(function () {
var fname = $.trim($('#form-reg-fullname').val());
$("#return").val("http://localhost:9000/app/fname");
});
</script>
Validation is working successfully while submitting the form but I am getting empty value in return input type. How can I make it work?

Looks like you are missing an id on the return input, you just have a name. So it should look like this:
<input type="hidden" name="return" id="return" value=""/>
That way when you call the input in js with $('#return') it will get it by it's proper id.

<input type="hidden" name="return" value=""/>
$("#return").val("http://localhost:9000/app/fname");//PROBLEM RESIDE Here
See what are you doing you are trying to assign the value to a selector that have id = return . But you don't have any element with this id however , you have an element with the same name.You can resolve this in two ways:
First selecting the element by its name:
$("input[name='return']").val("http://localhost:9000/app/fname");
or you can assign the id attribute to your input element as
<input type="hidden" id="return" name="return" value=""/>

You are assigning the value of input with id="return" which doesn't exist.
$("#return").val("http://localhost:9000/app/fname");
You should either give an id to input tag as
<input type="hidden" name="return" id="return" value=""/>
Or change script to
$("input[name='return']").val("http://localhost:9000/app/fname");

You call node using id in jquery , your return input doesnt have the Id called return
$('#registration-form').submit(function () {
var fname = $.trim($('#form-reg-fullname').val());
$("#return").val("http://localhost:9000/app/fname"); //setting the value
console.log($("#return").val()); //getting the value
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="https://www.sandbox.paypal.com/cgi-bin/webscr" method="post" target="_top" id="registration-form">
<input type="text" class="form-control" name="form-reg-fullname" data-form-field="Name" id="form-reg-fullname">
<input type="hidden" name="return" value="" id="return"/>
</form>

Remove <style> tag and <script> tag from plain HTML using Jquery

Here is my plain HTML code.
<style>
/* style tag goes here*/
</style>
<form method="POST" action="#" id="_form_93_" class="_form _form_93 _inline-form _dark" novalidate>
<input type="hidden" name="u" value="93" />
<input type="hidden" name="f" value="93" />
<input type="hidden" name="s" />
<input type="hidden" name="c" value="0" />
<input type="hidden" name="m" value="0" />
</form>
<script type="text/javascript">
// script tag goes here
</script>
I want to remove <style></style> and <script></script> tag from HTML code so expected result will be.
<form method="POST" action="#" id="_form_93_" class="_form _form_93 _inline-form _dark" novalidate>
<input type="hidden" name="u" value="93" />
<input type="hidden" name="f" value="93" />
<input type="hidden" name="s" />
<input type="hidden" name="c" value="0" />
<input type="hidden" name="m" value="0" />
</form>

You can remove the tags using this
$('style, script').remove();
Styles will no longer show on screen and both HTML elements will dissapear from the DOM.
BUT, javascript code will still be executed if events have been attached before running the remove() code.
If you're only looking to clean some code returning by an ajax call (for example), it will work fine. If you want to clear the styles and javascript from the page you're already in, some Javascript code might already be attached to elements before you remove the script tag.
Check this fiddle for an example.

Using jQuery:
jQuery('style').remove();
jQuery('script').remove();
Using Plain JavaScript:
window.onload = function(){
var getStyle = document.getElementsByTagName("style");
getStyle[0].remove();
var getScript = document.getElementsByTagName("script");
getScript[0].remove();
}
Please find a working fiddle, which shows how to delete h1 tag, Link

How to call trigger.('click')

<div class="kn-submit">
<input type="hidden" name="parent_object" value="">
<input type="hidden" name="parent_field" value="field_510">
<input type="hidden" name="parent_id" value="">
<input name="view_key" type="hidden" value="view_848">
<input name="view_name" type="hidden" value="Edit OperationNu">
<input type="submit" value="Submit">
<div class="kn-spinner" style="display: none"></div>
$('.kn-submit').trigger('mousedown');// those 2 doesnt give results :(
$('.kn-submit').trigger('click');
My issue is that I want to make this button autoclick when specific function is called
Calling trigger on the class doesn't have any effects

You are trying to trigger on div element. You need to trigger click on submit button in this div.
Change it to:
$('.kn-submit input[type="submit"]').trigger('click');
And you dont need this:
$('.kn-submit input[type="submit"]').trigger('mousedown');
But also if you want just submit the form, use your form id and call this:
$('#form_id').submit();

To auto submit the form:
<form id="myform" action="target.php" method="post">
<input type="hidden" name="parent_object" value="">
<input type="hidden" name="parent_field" value="field_510">
<input type="hidden" name="parent_id" value="">
<input name="view_key" type="hidden" value="view_848">
<input name="view_name" type="hidden" value="Edit OperationNu">
<input type="submit" value="Submit">
</form>
<script>
$('#myform').submit();
</script>

Put the class name in the submit button. Also use the anonymous functions because you are calling the trigger function but you are not telling it what to do. Here is two ways you can proceed after you fix the class name:
Method 1:
$(".kn-submit").trigger("click", function(){
// what you want to do
});//trigger function
Method 2:
$(".kn-submit").click(function(){
// what you want to do
});//click function

Changing 2 hidden input fields on select

I have a form that is need to be passed to my CRM.
the form is simple and contains 2 important fields that defines under what category the data will be received in my crm.
<form method="post" action="http://api.leadmanager.co.il/v1/submit" id="lm_form">
<input type="hidden" name="lm_form" value="5750" />
<input type="hidden" name="lm_key" value="cc0ce4fe280e46e986e5716f9feedaab" />
<input type="hidden" name="lm_tyt" value="" />
<input type="submit" value="submit"/>
</form>
I want to add a drop down list with 2 options first will send the form i mentiond above as is.
the second will modify the values of "lm_key" and "lm_form" to other values.

Plain JS code can be like this. But I would advice you to use some JS library like JQuery, AngulerJS or another one.
<form method="post" action="http://api.leadmanager.co.il/v1/submit" id="lm_form" name="form">
<input type="hidden" name="lm_form" value="5750" />
<input type="hidden" name="lm_key" value="cc0ce4fe280e46e986e5716f9feedaab" />
<input type="hidden" name="lm_tyt" value="" />
<select name="selectField" onchange="changeValues()">
<option value="1">1</value>
<option value="2">2</value>
</select>
<input type="submit" value="submit"/>
</form>
<script>
function changeValues() {
form.lm_key.value = form.selectField.value;
form.lm_form.value = form.selectField.value;
}
</script>

how to get the value by javascript?

HTML:
I want to pass the value from the gsearch to the q parameter. The following is the ways I make but it couldn't work. How should I do it?
action="http://test.com/search.php?q=<script type="text/javascript">document.getElementById('gsearch').value;</script>">
updated:
in my site. i want to make a google custom search: so i put the following code in the homepage. 0156290304977:8texhu0mrk the google search value. gsearch.php page which i put the google custom search code in and show the searched result
<form method="get" action="http://test.com/gsearch.php?cx=0156290304977:8texhu0mrk&cof=FORID:11&ie=UTF-8&q=..." >
<input type="text" title="" value="" name="q" class="search-input" id="gsearch" />
<input type="submit" value="" name="sa" id="search-button"/>
</form>
now, i want to when the user input the searched text in the gsearch text box, if he click the submit button,. then on the gsearch.php page shows the searched result.

if you want to submit to this: http://test.com/search.php?q=theinput
just do this:
<form target="_top" method="get" action="http://www.cnn.com/search.php" >
<input type="text" title="" value="theinput" name="q" class="search-input" id="gsearch" />
<input type="submit" value="submit" id="search-button"/>
</form>
the entire idea behind the <form> element is that it is making sure that all of the inputs from the user will be sent to the action.
the form will take the input from the q and add it to the action automatically.
so in your simple case. no manipulation is required.
Test it here
http://jsfiddle.net/L4rHG/1/
this will be submitted to http://edition.cnn.com/search.php?q=theinput

Or you need over javascritpt
<script>
function SubmitForm(){
window.open("http://test.com/search.php?q="+document.getElementById('gsearch').value)
return false;
}
</script>
<form method="get" action="http://test.com/search.php" onSubmit="SubmitForm();false" >
<input type="text" title="" value="" name="q" class="search-input" id="gsearch" />
<input type="submit" value="" name="sa" id="search-button"/>
</form>

<form action="http://test.com/search.php?q=">
<script>
document.forms[0].action += 'new_action.html';
</script>