Submit a form using Javascript named input submit

I have an HTML form where one of the inputs is called named submit . I also have a well-formatted HTML element inside the form that should submit the form when clicked.

I noticed that form.submit is overridden by an input field that is called submit, so I can no longer call form.submit().

I was looking for an answer, the general answer is renaming input. However, I cannot do this. submitmost often displayed as a parameter with a value in the request body.

Code example:

<form action="http://example.com/search" method="POST">
    <!-- other generated parameters -->
    <input value="findItems" name="submit" type="hidden">
    <a onclick="event.stopPropagation();this.parentNode.submit()" href="javascript:{}">
        <!-- this is dinamically generated 
            and generally much more complex --->
        <strong>search</strong> 
    </a>
</form>

Keep in mind that my limitations are as follows:

  • the element that users click to submit the form contains other formatted elements.
  • submitis a required parameter in the request body
  • POST
  • - back-end

PS: , .

+4
3

:

<input value="findItems" name="submit[]" type="hidden" />

[] , .

:

<input type="submit">, click :

<form action="http://google.com/search" method="POST">
    <!-- other generated parameters -->
    <input value="findItems" name="submit" type="hidden" />
    <a onclick="event.stopPropagation();" href="javascript:goo()">
        <!-- this is dinamically generated 
            and generally much more complex --->
        <strong>search</strong> 
    </a>
  <input type="submit" id="send" />
</form>

submit id send, DOM.

goo() href search. :

function goo(){     
       fireEvent(document.getElementById('send'),'click');
    }
    function fireEvent(obj, evt){
     var fireOnThis = obj;
     if( document.createEvent ) {
       var evObj = document.createEvent('MouseEvents');
       evObj.initEvent( evt, true, false );
       fireOnThis.dispatchEvent( evObj );
     }
      else if( document.createEventObject ) { //IE
       var evObj = document.createEventObject();
       fireOnThis.fireEvent( 'on' + evt, evObj );
     } 
} 

: http://jsbin.com/vecebo/1/

CSS style="visibility: hidden"

+1

document.forms[0].submit();

, , , click

form.submit.click();

,

+2

-, . form.submit(), , AJAX.

jQuery, , :

<script>
function submitForm(){      
  $.ajax({
     url:  "http://example.com/search",
     data: {
         submit : $("#submit").val()
     },
     success: function(){alert("It worked!");},
     error: function (xhr, textStatus, errorThrown){alert(errorThrown)},
     async: false
  });
}
</script>

HTML:

<form id="form1" name="form1" method="POST">
    <input type="hidden" id="submit" name="submit"/>
    <input type="button" value="Submit" onclick="javascript:submitForm()">
</form>
0
source

All Articles