<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
Related
I have a form where I would like to hide the submit button unless the input is focussed/selected.
There is only one input apart from the submit.
I need to do this using pure JS (or perhaps CSS/Sass), not jQuery etc.
Basic example:
<form>
<input type="text" placeholder="Example field">
<input type="submit value="Submit">
</form>
First get references to your objects, so change the HTML for example :
<form>
<input id="input_1" type="text" placeholder="Example field">
<input id="submit" type="submit" value="Submit" />
</form>
With some CSS we will hide the submit by default:
#submit{
display:none;
}
We have added Id's, now we add the event listeners for focus on input..
document.getElementById("input_1").addEventListener('focus', function(){
document.getElementById("submit").style.display = 'block';
}
, true);
The second param into the eventListener will execute when the event is fired..
You will need to do more work on this..
https://jsfiddle.net/7uzkzr67/
Here is the pure CSS solution;
.showonfocus{
display:none;
}
.inputfield:focus + .showonfocus{
display:inline;
}
<form>
<input type="text" placeholder="Example field" class="inputfield">
<input type="submit" value="Submit" class="showonfocus">
</form>
You can use the onblur and onfocus events to manipulate your html elements. You can try something like,
HTML
<form>
<input type="text" placeholder="Example field" onblur="setVisible('hidden');" onfocus="setVisible('visible');">
<input id="submit" type="submit" value="Submit" style="visibility:hidden">
</form>
Javscript
function setVisible(state) {
document.getElementById("submit").style.visibility = state;
}
Here is the working DEMO: https://jsfiddle.net/qbotxpL6/
Hope this helps!
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>
I have two buttons on page:
<div class="bottons">
<button class="wiz_button wizard_prev_step" type="button" style="margin-top: 27px;
display: none"><span><span>Previous</span></span></button>
<form id="orderForm" method="POST">
<input type="hidden" name="Signed_Order_B64" value="">
<input type="hidden" name="email" size="50" maxlength="50" value="">
<input type="hidden" name="Language" value="rus">
<input type="hidden" name="firstname" value="">
<input type="hidden" name="surname" value="">
<input type="hidden" name="appendix" value="">
<button class="wiz_button wizard_next_step disabled long" type="button" style="margin-top: 27px;">
<span><span>Next</span></span></button>
</form>
</div>
This buttons from my custom wizard. Also, I have a click event handler for Next button:
$('.wizard_next_step').click(function () {
// load next step and other stuff
})
I want when user locate on the last step the post form:
if (currentStep === '3') {
// here I want set onsubmit function for the form *
}
How can I do this?
Thanks.
PS. The solution must works in IE 7 and above.
Just do:
$('#orderForm').submit()
Your are using jQuery. so simply use
if (currentStep === '3') {
// here I want set onsubmit function for the form and submit it *
$('#orderForm').submit();
}
Since the button is in the form, and within the attached listener this will reference the button, you can assign to the onsubmit property using:
this.form.onsubmit = someFn;
and submit the form using:
this.form.submit();
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>
I'm currently working on a basic form. When you hit the submit button, it should first change the value of a field, and then submit the form as usual. It all looks a bit like this:
<form name="myform" id="myform" action="action.php">
<input type="hidden" name="myinput" value="0" />
<input type="text" name="message" value="" />
<input type="submit" name="submit" onclick="DoSubmit()" />
</form>
And this is how far I've come with the JavaScript code. It changes "myinput"'s value to 1, but it does not submit the form.
function DoSubmit(){
document.myform.myinput.value = '1';
document.getElementById("myform").submit();
}
You could do something like this instead:
<form name="myform" action="action.php" onsubmit="DoSubmit();">
<input type="hidden" name="myinput" value="0" />
<input type="text" name="message" value="" />
<input type="submit" name="submit" />
</form>
And then modify your DoSubmit function to just return true, indicating that "it's OK, now you can submit the form" to the browser:
function DoSubmit(){
document.myform.myinput.value = '1';
return true;
}
I'd also be wary of using onclick events on a submit button; the order of events isn't immediately obvious, and your callback won't get called if the user submits by, for example, hitting return in a textbox.
document.getElementById("myform").submit();
This won't work as your form tag doesn't have an id.
Change it like this and it should work:
<form name="myform" id="myform" action="action.php">
Here is simple code. You must set an id for your input. Here call it 'myInput':
var myform = document.getElementById('myform');
myform.onsubmit = function(){
document.getElementById('myInput').value = '1';
myform.submit();
};
No. When your input type is submit, you should have an onsubmit event declared in the markup and then do the changes you want. Meaning, have an onsubmit defined in your form tag.
Otherwise change the input type to a button and then define an onclick event for that button.
You're trying to access an element based on the name attribute which works for postbacks to the server, but JavaScript responds to the id attribute. Add an id with the same value as name and all should work fine.
<form name="myform" id="myform" action="action.php">
<input type="hidden" name="myinput" id="myinput" value="0" />
<input type="text" name="message" id="message" value="" />
<input type="submit" name="submit" id="submit" onclick="DoSubmit()" />
</form>
function DoSubmit(){
document.getElementById("myinput").value = '1';
return true;
}
My problem turned out to be that I was assigning as document.getElementById("myinput").Value = '1';
Notice the capital V in Value? Once I changed it to small case, i.e., value, the data started posting. Odd as it was not giving any JavaScript errors either.
I have done this and it works for me.
At first you must add a script such as my SetHolderParent() and call in the html code like below.
function SetHolderParent(value) {
alert(value);
}
<input type="submit" value="Submit" onclick="SetHolderParent(222);" />
You can use the onchange event:
<form name="myform" id="myform" action="action.php">
<input type="hidden" name="myinput" value="0" onchange="this.form.submit()"/>
<input type="text" name="message" value="" />
<input type="submit" name="submit" onclick="DoSubmit()" />
</form>
This might help you.
Your HTML
<form id="myform" action="action.php">
<input type="hidden" name="myinput" value="0" />
<input type="text" name="message" value="" />
<input type="submit" name="submit" onclick="save()" />
</form>
Your Script
<script>
function save(){
$('#myinput').val('1');
$('#form').submit();
}
</script>