[jquery] jQuery를 사용하여 양식 제출 [닫기]

jQuery를 사용하여 양식을 제출하고 싶습니다. 누군가 코드, 데모 또는 예제 링크를 제공 할 수 있습니까?

답변

양식을 정상적으로 제출하는지 또는 AJAX 호출을 통해 제출하는지에 따라 다릅니다. jquery.com 에서 예제가 포함 된 설명서를 포함하여 많은 정보를 찾을 수 있습니다 . 양식을 정상적으로 제출하려면 submit()해당 사이트에서 방법을 확인 하십시오. 들어 AJAX 당신은 아마 중 하나를 사용할 불구하고, 여러 가지 가능성이있다 ajax()또는 post()방법을. 참고 post()단지 편리한 방법 정말이 호출 ajax()A, 단순화 및 제한 인터페이스 방법.

내가 매일 사용하는 중요한 리소스는 북마크해야하는 jQuery 작동 방식입니다. 입니다. jQuery 사용에 대한 자습서가 있으며 왼쪽 탐색을 통해 모든 설명서에 액세스 할 수 있습니다.

예 :

표준

$('form#myForm').submit();

아약스

$('input#submitButton').click( function() {
    $.post( 'some-url', $('form#myForm').serialize(), function(data) {
         // ... do something with response from server
       },
       'json' // I expect a JSON response
    );
});

$('input#submitButton').click( function() {
    $.ajax({
        url: 'some-url',
        type: 'post',
        dataType: 'json',
        data: $('form#myForm').serialize(),
        success: function(data) {
                   // ... do something with the data...
                 }
    });
});

위 의 ajax()및 post()방법은 동일합니다. ajax()오류 등을 처리 하기 위해 요청에 추가 할 수있는 추가 매개 변수가 있습니다 .

답변

를 사용해야 $("#formId").submit()합니다.

일반적으로 함수 내에서 이것을 호출합니다.

예를 들면 다음과 같습니다.

<input type='button' value='Submit form' onClick='submitDetailsForm()' />

<script language="javascript" type="text/javascript">
    function submitDetailsForm() {
       $("#formId").submit();
    }
</script>

Jquery 웹 사이트 에서 이에 대한 자세한 정보를 얻을 수 있습니다 .

답변

기존 양식이 있으면 이제 jquery와 함께 작동해야합니다. 이제 ajax / post를 사용하십시오.

제출 양식에 매 달리십시오-양식의 이벤트
제출의 기본 기능 방지

자신의 일을

$(function() {
    //hang on event of form with id=myform
    $("#myform").submit(function(e) {

        //prevent Default functionality
        e.preventDefault();

        //get the action-url of the form
        var actionurl = e.currentTarget.action;

        //do your own request an handle the results
        $.ajax({
                url: actionurl,
                type: 'post',
                dataType: 'application/json',
                data: $("#myform").serialize(),
                success: function(data) {
                    ... do something with the data...
                }
        });

    });

});

위해서는, 유의하시기 바랍니다 serialize()위의 예에서 일할 기능, 모든 양식 요소는 한 필요 name속성이 정의.

양식의 예 :

<form id="myform" method="post" action="http://example.com/do_recieve_request">

<input type="text" size="20" value="default value" name="my_input_field">
..
.
</form>

@PtF-이 샘플에서 POST를 사용하여 데이터가 제출되므로, 다음을 통해 데이터에 액세스 할 수 있습니다.

 $_POST['dataproperty1']

여기서 dataproperty1은 json의 “변수 이름”입니다.

CodeIgniter를 사용하는 경우 샘플 구문은 다음과 같습니다.

 $pdata = $this->input->post();
 $prop1 = $pdata['prop1'];
 $prop1 = $pdata['prop2'];

답변

jQuery에서는 다음을 선호합니다.

$("#form-id").submit()

그러나 다시 한 번, 해당 작업을 수행하기 위해 jQuery가 필요하지 않습니다. 일반 JavaScript 만 사용하십시오.

document.getElementById("form-id").submit()

답변

매뉴얼에서 : jQuery Doc

$("form:first").submit();

답변

누군가가 사용하는 경우 정보

$('#formId').submit();

이런 식으로하지 마십시오

<button name = "submit">

submit ()이 이렇게 작동하지 않는다는 것을 알게 되려면 많은 시간이 걸렸습니다.

답변

jquery를 사용하여 양식을 제출할 때 사용하십시오. 여기 링크 http://api.jquery.com/submit/

<form id="form" method="post" action="#">
    <input type="text" id="input">
    <input type="button" id="button" value="Submit">
</form>

<script type="text/javascript">
$(document).ready(function () {
    $( "#button" ).click(function() {
        $( "#form" ).submit();
    });
});
</script>