jquery başvuru formu ve sonra mevcut bir div içinde sonuçları göster

Question

Gönderildiğinde, bir php dosyası (girdilerin dosyaya aktarılması) alması ve ardından sonucu alması gereken basit bir metin giriş formuna sahibim. metin) ve bir div'a yerleştirin ve div görüntüyü gözden geçirin.

<form id=create method=POST action=create.php> 
<input type=text name=url> 
<input type="submit" value="Create" /> 

<div id=created></div> 

Benim ihtiyacım create.php?url=INPUT sonuçları ise, dinamik created denilen div yüklenecek: Burada

Şimdi ne var.

jquery form script'im var, ancak doğru şekilde çalışamadım. Ama kütüphaneyi yükledim (dosya).

Answer 1

Bu kod bunu yapmalıdır. Bir gönderme düğmenin tıklama etkinliği bir form için yakalamak için uygun bir olay değildir

$('#create').submit(function() { // catch the form's submit event 
    $.ajax({ // create an AJAX call... 
     data: $(this).serialize(), // get the form data 
     type: $(this).attr('method'), // GET or POST 
     url: $(this).attr('action'), // the file to call 
     success: function(response) { // on success.. 
      $('#created').html(response); // update the DIV 
     } 
    }); 
    return false; // cancel original event to prevent form submitting 
}); 

Answer 2

Sayfanın yenilenmesini istemiyorsanız formu göndermek için AJAX kullanmalısınız.

$('#create').submit(function() { 
    $.post('create.php', $('#create').serialize(), function (data, textStatus) { 
     $('#created').append(data); 
    }); 
    return false; 
}); 

Answer 3

Bu yakalamak dosya yükleme

$(document).on("submit", "form", function(event) 
{ 
    event.preventDefault(); 

    var url=$(this).attr("action"); 
    $.ajax({ 
     url: url, 
     type: 'POST', 
     dataType: "JSON", 
     data: new FormData(this), 
     processData: false, 
     contentType: false, 
     success: function (data, status) 
     { 
      $('#created').html(data); //content loads here 

     }, 
     error: function (xhr, desc, err) 
     { 
      console.log("error"); 

     } 
    });   

});