JavaScript not working inside iframe in Firefox - javascript

I am using an iframe that loads a page with a form. The form action is overridden using javascript. The javascript form action is working in IE and Chrome. But in Firefox the javascript is not working and the form is getting submitted to http://example.com/index.php
The code is given below:
<script language='Javascript' type='text/JavaScript'>
function submitFunction() {
document.Insert.action = 'http://example.com/page2.php';
return true;
}
</script>
<FORM ACTION='http://example.com/index.php' METHOD='POST' ENCTYPE='x-www-form-urlencoded' name='Insert' id='Insert' autocomplete='off' onsubmit='return(submitFunction())'>
<input name='num' SIZE='45' MAXLENGTH='45'>
<input name='Submit' type='submit'/>
</FORM>
Thanks in advance.

Change
document.Insert.action = 'http://example.com/page2.php';
to
document.getElementById('Insert').action = 'http://example.com/page2.php';
But it seems a little strange to change the action URL of the form in the onsubmit. You could as well have it defined from the start.

Related

How to fill in input with "require" using javascript?

I am new to java script. I have created an input which is requires the user to input some text to enable the submit button.
<input class="param" name="test" id="test" required ng-model="test">
How can I fill in the input text box using Java Script so I can submit the form (as if the user has entered the text). Currently, when I use for example the following script to update the value, the submit button on the form is not active.
document.getElementById("test").value =1
Could you update the attribute that ng-model is bound to? That should apply the value to the text field correctly.
I have created this example code:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function updateValue() {
document.getElementById("test").value = 'test';
}
window.onload = function () {
updateValue();
}
</script>
</head>
<body>
<form action="" method="post">
<input type="text" id="test" name="test" required>
<input type="submit" value="Okay">
</form>
</body>
</html>
This is what Phani Kumar M and Claies were asking for. I tested it on Windows 10 in Firefox 55.0.3 and Chrome 60.0.3112.113. In both browsers it works correctly. The form can be submitted without adding anything to the field.
Others can check other platforms. As mentioned, the required attribute will not work in Safari.
Your problem is somewhere else. I don't know anything about AngularJS, which you seem to be using without even mentioning it, but it might be there.

submit a form without using a submit button

I am trying to submit this for without using a submit button. Here I have used javascript and once the form has submitted user should be directed to the B.php.
html code
<form id="jsform" action="B.php" method="POST" target="_blank">
<input type="hidden" value="test" name="title"/>
</form>
java-script code
<script type="text/javascript">
document.getElementById('jsform').submit();
</script>
These 2 code lines run separately but not running together. Any mistakes have I done.
In javascript you can do this:
window.onload=function() {
document.getElementById("jsform").submit(); // using ID
}
And with jQuery
$(function() {
$("#jsform").submit(); // using ID
});
I write my comment as an actual answer this time.
Drop target="_blank" and it should work just fine. Otherwise your browser might see it as a popup.
Also make sure your JS is run after your form.
Use form name to submit
document.myform.submit();

Not able to submit form in chrome through javascript

Form submission is working good on both IE and Firefox, but recently i tested my application on chrome. In that i found chrome is not submitting form, there are no error messages in chrome console, can u help me. i had gone through server answers , still i didn't get proper solution. here is my js code
<script type="text/javascript">
function callModule(){
document.frmcheckUserDomain.submit();
}
</script>
<form name="frmcheckUserDomain" action="checkUserDomain.do" method="post">
// here is my form fields
<input type="button" name="subBtn" value="Submit" onClick="callModule();" />
</form>
Try changing your callModule method to this...
function callModule(){
document.getElementById("frmcheckUserDomain").submit();
}
Also, you will want to give your form tag an id attribute...
You could also access the form via index as well...
function callModule() {
document.forms[0].submit();
}
first of all why don't you use input submit button instead, like:
<input type="submit" name="subBtn" value="Submit" />
and if you have some stuff to do when the form gets submitted, you can use onsubmit event in your form.
And for your solution, you can pass it as an argument and then submit it:
<input type="button" name="subBtn" value="Submit" onClick="callModule(this);" />
your function:
function callModule(elm){
elm.parentNode.submit();
}
see, your code is working fine in my Google chrome. i think u have some issues with your browser or better u check the java Servlet configuration.

javascript xslt will not correctly post data

I am trying to submit a form using javascript (generated from an xslt stylesheet).
<form name='myform' action='search.php' method='post'>
<input type='hidden' name='query' />
<script type='text/javascript'>
function submit(id)
{
document.myform.elements[0] = id; *Note* I have tried document.getElementById('query').value = id;
document.myform.submit();
}
</script>
</form>
After this code I have xsl translations formatting xml data. I call the submit function like this:
NOTE This href='' does nothing
submit('somequery')
When I click on the href the javascript function executes and seems to work fine, except NO data gets POST'ed. I set the value to 'somequery' but when the form gets POST'ed, the value is '' (blank).
Why does it do this? I have tried createElement('input') and such from within javascript but I cannot ever get the form to POST the input value.
Are you using Firefox here? The behaviour may differ between browser. Firstly, you should go back to using getElementById
document.getElementById('query').value = id;
The reason this may not have worked is that your hidden element does not actually specify an id attribute.
<input type='hidden' name='query' id='query' />
In IE, I believe it allows a lack of id and assumes it is equal to the name. In Firefox, a lack of id results in a javascript error when you try to do getElementById
<form name='myform' action='search.php' method='post'>
<input type='hidden' name='query' id='query' />
<script type='text/javascript'>
function submit(id)
{
document.getElementById('query').value = id;
document.myform.submit();
}
</script>
</form>

javascript function is not a function

This is the javascript code im using.
<script language="javascript" type="text/javascript">
function cancelevent()
{
input_box=confirm("Are you sure you want to cancel?");
if (input_box==true) {
document.cancelevent.submit();
} else {
}
}
</script>
This is the form thats being submitted:
<form name=cancelevent method="post" action="whor.php">
<input type="hidden" name="owner" value="owner">
Cancel
</form>
I have this form on 2 different pages. One page it works, the other, i get this error
Error: document.cancelevent.submit is not a function
Ive literally copy and pasted the code from the working page to the 2nd page....no idea what is going on or why it would do this.
I think the problem is that the HTML form and the javascript function have the same name!
Put an id on your form
<form id="cancelEventForm" name=cancelevent method="post" action="whor.php">
And use
document.getElementById('cancelEventForm').submit();

Categories

Resources