복붙노트

[JQUERY] jQuery를 사용하여 양식 제출 [폐쇄]

JQUERY

jQuery를 사용하여 양식 제출 [폐쇄]

해결법

  1. 1.그것은 당신이 일반적으로 또는 AJAX 호출을 통해 양식을 제출 여부에 따라 달라집니다. 당신은 예제와 함께 문서를 포함, jquery.com에서 많은 정보를 찾을 수 있습니다. 일반적으로 양식을 제출하는 경우, 해당 사이트에 제출 () 메소드를합니다 확인하십시오. 당신은 아마 아약스 () 또는 포스트 () 메소드 중 하나를 사용하고자하지만 AJAX를 들어, 여러 가지 가능성이있다. 해당 게시물을 () 참고 정말, 단순화 및 제한 인터페이스 아약스 () 메서드를 호출하기 위해 단지 편리한 방법입니다.

    그것은 당신이 일반적으로 또는 AJAX 호출을 통해 양식을 제출 여부에 따라 달라집니다. 당신은 예제와 함께 문서를 포함, jquery.com에서 많은 정보를 찾을 수 있습니다. 일반적으로 양식을 제출하는 경우, 해당 사이트에 제출 () 메소드를합니다 확인하십시오. 당신은 아마 아약스 () 또는 포스트 () 메소드 중 하나를 사용하고자하지만 AJAX를 들어, 여러 가지 가능성이있다. 해당 게시물을 () 참고 정말, 단순화 및 제한 인터페이스 아약스 () 메서드를 호출하기 위해 단지 편리한 방법입니다.

    당신이 즐겨 찾기에 추가해야한다는 중요한 자원, 내가 매일 사용 하나, 어떻게 jQuery를 작품이다. 그것은 사용하여 jQuery를에 자습서를 가지고 있으며, 왼쪽 탐색은 모든 문서에 액세스 할 수 있습니다.

    예를 들면 :

    표준

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

    AJAX

    $('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...
                 }
    });
});

    아약스 () 및 포스트 () 메소드는 상기 동일하다는 것을 유의해야한다. 추가 당신이 아약스 ()에 추가 할 수있는 매개 변수 핸들 오류 등을 요청할 수있다

  2. 2.당신은 $ ( "# formId")을 사용해야합니다. 제출 ().

    당신은 $ ( "# formId")을 사용해야합니다. 제출 ().

    당신은 일반적으로 함수 내에서이 부를 것이다.

    예를 들면 :

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

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

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

  3. 3.기존 양식이있는 경우, jQuery로 그해야 지금 작업 - 아약스 / 포스트 지금 당신은 할 수 :

    기존 양식이있는 경우, jQuery로 그해야 지금 작업 - 아약스 / 포스트 지금 당신은 할 수 :

    위의 예에서 작업에 직렬화 () 함수를 위해서는, 모든 양식 요소는 이름 속성을 정의해야 할 필요가 있다는 점 유의 하시길 바랍니다.

    양식의 예 :

    <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'];

  4. 4.jQuery를 나는 다음을 선호하는 것 :

    jQuery를 나는 다음을 선호하는 것 :

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

    하지만 다시, 당신은 정말 그 작업을 수행 할 jQuery를 필요가 없습니다 - 그냥 평범한 자바 스크립트를 사용 :

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

  5. 5.의 jQuery 문서 : 수동에서

    의 jQuery 문서 : 수동에서

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

  6. 6.정보를 위해 사람이 사용하는 경우

    정보를 위해 사람이 사용하는 경우

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

    이 같은하지 무언가를

    <button name = "submit">

    그것은 다음과 같이 작동하지 않습니다 제출 나 ()를 찾기 위해 많은 시간이 걸렸다.

  7. 7.jQuery를 사용하여 양식을 제출하는 데 사용합니다. 여기 링크가 http://api.jquery.com/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>

  8. 8.이 프리 로더와 함께 양식을 보내드립니다 :

    이 프리 로더와 함께 양식을 보내드립니다 :

    var a=$('#yourform').serialize();
$.ajax({
    type:'post',
    url:'receiver url',
    data:a,
    beforeSend:function(){
        launchpreloader();
    },
    complete:function(){
        stopPreloader();
    },
    success:function(result){
         alert(result);
    }
});

    임의의 방법으로 개혁 양식 데이터 포스트 http://www.jackart4.com/article.html을 만들기 위해 몇 가지 트릭을 i'have

  9. 9.

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

    제출 / 이벤트를 참조하십시오.

  10. 10.A는 양식에 대한 이벤트 리스너를 제출 이미 설치 한 경우, 내부 호출이 제출하는 것을 주 ()

    A는 양식에 대한 이벤트 리스너를 제출 이미 설치 한 경우, 내부 호출이 제출하는 것을 주 ()

    jQuery('#<form-id>').submit( function(e){ 
    e.preventDefault();
    // maybe some validation in here
    if ( <form-is-valid> ) jQuery('#<form-id>').submit();
});

    그것의 이벤트를 (실패한) 제출이 양식에 대한 새로운 이벤트 리스너를 설치하려고으로 작동하지 않습니다. 당신이 대한 액세스를 가질 수 있도록 HTML 요소 자체 (jQquery에서 포장을 벗긴) 및 호출이 요소에 () 제출

        jQuery('#<form-id>').submit( function(e){ 
      e.preventDefault();
      // note the [0] array access:
      if ( <form-is-valid> ) jQuery('#<form-id>')[0].submit();
    });

  11. 11.또한 아약스 aswell을 이용하여 제출 JQuery와 양식 플러그인을 사용할 수 있습니다 :

    또한 아약스 aswell을 이용하여 제출 JQuery와 양식 플러그인을 사용할 수 있습니다 :

    http://malsup.com/jquery/form/

  12. 12.

    jQuery("a[id=atag]").click( function(){

    jQuery('#form-id').submit();      

            **OR**

    jQuery(this).parents("#form-id").submit();
});

  13. 13.Internet Explorer에서 동적으로 생성 된 형태의 문제가 있습니다. 이런 식으로 만든 형태로 IE에 제출하지 않습니다 (9)

    Internet Explorer에서 동적으로 생성 된 형태의 문제가 있습니다. 이런 식으로 만든 형태로 IE에 제출하지 않습니다 (9)

    var form = $('<form method="post" action="/test/Delete/">' +
             '<input type="hidden" name="id" value="' + myid + '"></form>');
$(form).submit();

    이 IE에서 작동하려면하면 양식 요소를 만들고과 같이 제출하기 전에 첨부 :

    var form = document.createElement("form");
$(form).attr("action", "/test/Delete")
       .attr("method", "post");
$(form).html('<input type="hidden" name="id" value="' + myid + '" />');
document.body.appendChild(form);
$(form).submit();
document.body.removeChild(form);

    HIERARCHY_REQUEST_ERR (3) : -을 부착 한 후 작업을하지 않습니다 예 1에서와 같이 양식을 작성 및 IE9에서은 JScript의 오류 DOM 예외를 throw

    @ https://stackoverflow.com/a/6694054/694325 W 토미 소품

  14. 14.솔루션은 지금까지 양식의 ID를 알고 당신이 필요합니다.

    솔루션은 지금까지 양식의 ID를 알고 당신이 필요합니다.

    ID를 알 필요없이 양식을 제출이 코드를 사용 :

    function handleForm(field) {
    $(field).closest("form").submit();
}

    당신이 버튼의 클릭 이벤트를 처리하고자한다면 예를 들어, 당신은 사용할 수 있습니다

    $("#buttonID").click(function() {
    handleForm(this);    
});

  15. 15.버튼이 폼 태그 사이에있는 경우,이 버전을 선호합니다 :

    버튼이 폼 태그 사이에있는 경우,이 버전을 선호합니다 :

    $('.my-button').click(function (event) {
    var $target = $( event.target );
    $target.closest("form").submit();
});

  16. 16.이처럼 사용할 수 있습니다 :

    이처럼 사용할 수 있습니다 :

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

    또는

    document.formName.submit();

  17. 17.동적 양식에 대한 IE 트릭 :

    동적 양식에 대한 IE 트릭 :

    $('#someform').find('input,select,textarea').serialize();

  18. 18.나의 접근 방식이 약간 다른 변경 제출 버튼을 누른 다음에 버튼을

    나의 접근 방식이 약간 다른 변경 제출 버튼을 누른 다음에 버튼을

    $("#submit").click(function(event) {
$(this).attr('type','submit');
$(this).click();
});

  19. 19.

    function  form_submit(form_id,filename){
    $.post(filename,$("#"+form_id).serialize(), function(data){
        alert(data);
    });
}

    그것은 AJAX를 통해 주어진 파일 이름에 양식 데이터를 게시 할 예정입니다.

  20. 20.당신은 모든 형태의 코드를 추가 할 필요가 없습니다 그래서 나는 일반적인 솔루션을 권장합니다. JQuery와 양식 플러그인 (http://jquery.malsup.com/form/)를 사용하여이 코드를 추가합니다.

    당신은 모든 형태의 코드를 추가 할 필요가 없습니다 그래서 나는 일반적인 솔루션을 권장합니다. JQuery와 양식 플러그인 (http://jquery.malsup.com/form/)를 사용하여이 코드를 추가합니다.

    $(function(){
$('form.ajax_submit').submit(function() {
    $(this).ajaxSubmit();
            //validation and other stuff
        return false; 
});

});

  21. 21.이처럼 할 수 :

    이처럼 할 수 :

    $('#myform').bind('submit', function(){ ... });

  22. 22.나는 또한이 아약스를 통해 (실제로 그것을 제출하지 않고) 양식을 제출하려면 다음을 사용하고 있습니다 :

    나는 또한이 아약스를 통해 (실제로 그것을 제출하지 않고) 양식을 제출하려면 다음을 사용하고 있습니다 :

      jQuery.get("process_form.php"+$("#form_id").serialize(), {}, 
    function() {
      alert("Okay!"); 
    });

    23. from https://stackoverflow.com/questions/1200266/submit-a-form-using-jquery by cc-by-sa and MIT license

'JQUERY' 카테고리의 다른 글

[JQUERY] 선택과 AJAX 기반의 사이트에서 바로 컨트롤을 활성화  (0) 2020.09.23
[JQUERY] 모든 JQuery와 이벤트는 $ (문서)에 결합해야 하는가?  (0) 2020.09.23
[JQUERY] 온 클릭 VS jQuery.click ()  (0) 2020.09.23
[JQUERY] 어떻게 특정 지수 (자바 스크립트)에서 배열에 항목을 삽입하려면?  (0) 2020.09.23
[JQUERY] 객체에 등록 된 이벤트 핸들러를 찾을 수 JQuery와  (0) 2020.09.23
,

티스토리툴바