2013-06-19 5 views
2

Я использую Ajax и JQuery, чтобы получить выход на событие щелчка на кнопке отправкиКак остановить событие onload?

У меня есть два файла

  1. Index.php (содержит JQuery & Ajax код)
  2. actionfile.php (Файл PHP, который извлекает данные, передаваемые по Ajax код в Index.php и сохраняет данные в файле)

index.php:

<!DOCTYPE html> 
<html> 
<head> 
<script src="http://code.jquery.com/jquery-latest.js"></script> 

</head> 
<body> 

<form name="myform" method="post"> 
<input type="text" name="txt1" id="txt1" value="121212"/> 
<input type="submit" value="submit" id="submit" name="submit" /> 
</form> 

<script> 
$("#submit").click(function() { 
    var txt =document.getElementById('txt1').value; //textbox value 
    alert(txt); 
    var txt1 = "txt1="+txt; 
    alert(txt1); 
    $.ajax({ 
      type: "POST", 
      url: "actionfile.php", 
      data:txt1, 
      success: function() { 
       alert("success"); 
      } 
     }); 
    }); 
</script> 
</body> 

</html> 

И actionfile.php:

<?php 
    error_reporting(E_ALL); 
    $map=$_POST['txt1']; 
    $fp=fopen("file.txt","w"); 
    fwrite($fp,$map); 
    fclose($fp); 
?> 

Проблема заключается в том, если я удалить кусок кода $("#submit").click(function() Аякса прекрасно работает, то есть он представляет данные при загрузке страницы (при условии, Даю значение по умолчанию в текстовом поле). Когда я сохраняю код $("#submit").click(function() неповрежденным, функция вызывается только при нажатии кнопки отправки, но в этом случае AJAX терпит неудачу.

код доступен на http://www.code.guru99.com/kishore

Что является причиной этой проблемы?

+0

Что вы имеете в виду под «АЯКС сбой»? Вы получаете сообщения об ошибках? – cfs

ответ

1

попробовать это:

$("form").submit(function(e){ 
     e.preventDefault(); 

     var txt =document.getElementById('txt1').value; //textbox value 
     alert(txt); 
     var txt1 = "txt1="+txt; 
     alert(txt1); 
     $.ajax({ 
       type: "POST", 
       url: "actionfile.php", 
       data:txt1, 
       success: function() { 
        alert("success"); 

        //here you can simulate click submit 
       } 
      }); 
     }); 
     }); 
0

Просто измените форму типа submit к button:

<input type="button" value="submit" id="submit" name="submit" /> 
+1

AFAIK, Button Внутри формы действует как кнопка отправки. –

+1

@Baadshah Кто сказал это? вы можете попробовать себя. Просто измените тип на приведенной выше ссылке и попробуйте :) –

+2

@Baadshah: 'type =" button "' will * not * представить форму. 'type =" submit "будет. –

0

Применение Как это:

Изменить представить в кнопку.

 <form name="myform" method="post"> 
     <input type="text" name="txt1" id="txt1" value="121212"/> 
     <input type="button" value="submit" id="submit" name="submit" onclick="test();" /> 


<script> 
     function test() 
{ 
var txt =document.getElementById('txt1').value; //textbox value 
alert(txt); 
var txt1 = "txt1="+txt; 
alert(txt1); 
$.ajax({ 
     type: "POST", 
     url: "actionfile.php", 
     data:txt1, 
     success: function() { 
      alert("success"); 
     } 
    }); 
} 
</script> 

надеюсь, что это даст вам некоторое решение.

+0

Зачем вы заменяете обработчик связанного события встроенным? –

+0

@Rocket проверьте, что это даст точный результат. – Nirmal

+0

Да, я знаю, что так будет. Но это плохая практика и до сих пор не решит его проблему. –

0

Ваш код работает, когда вы удаляете $("#submit").click(function(), потому что ваш <form> отправлен и отправлены данные.

Чтобы AJAX представить данные, вам нужно использовать type="button" или изменить событие:

$("#submit").click(function(e) { 
    e.preventDefault(); 
Смежные вопросы