2015-09-02 3 views
1

У меня есть вот такой вид:Проблема при отправке формы с Представлять кнопка отключена

<form id="register-form" action="<?=$_SERVER['PHP_SELF']?>" method="post"> 
    <label>Name <span style='color: red'>*</span><br/> 
     <input type='text' name='user_name'/> 
    </label> 
    <label>Email <span style='color: red'>*</span><br/> 
     <input type='text' name='user_email'/> 
    </label> 
    //Another form elements 
    <button name='register' type='submit'>Register</button> 
</form> 

Чтобы обработать форму, я использую:

if(isset($_POST['register'])) 
{ 
    //Process 
} 

Что мне нужно, это кнопка register быть отключена, если пользователь нажимает на него. Я нашел решение:

$('#register-form').submit(function() 
{ 
    $(this).find(":submit").attr('disabled', 'disabled'); 
}); 

С помощью этого кода JQuery кнопка отключена, когда я нажимаю на него, но PHP не обрабатывать форму. Как это исправить?

+0

Это работает для меня [здесь] (http://jsfiddle.net/8qe4mygq/), но я мог бы что-то пропустил. – Anders

+0

Какую версию jQuery вы используете? Возможно, вы захотите использовать '.prop()' вместо '.attr()' –

+0

@JayBlanchard Даже с '.prop()' форма не ограничивается. – Dyan

ответ

0

Я нашел решение, используя небольшой хак ,
Как? Я создаю скрытый ввод в форме под названием register.

<form id="register-form" action="<?=$_SERVER['PHP_SELF']?>" method="post"> 
<label>Name <span style='color: red'>*</span><br/> 
    <input type='text' name='user_name'/> 
</label> 
<label>Email <span style='color: red'>*</span><br/> 
    <input type='text' name='user_email'/> 
</label> 
//Another form elements 
<input type='hidden' name='register'/> 
<button id='register'>Register</button> 
</form> 

Теперь я отправить форму с JQuery:

$('#register').click(function() 
{ 
    $('#register-form').submit(); 
    $(this).prop('disabled', true); 
}); 

Используя этот трюк кнопка то будет подавать форму не отключены, только кнопка, которая вызывает функцию. Затем PHP может обрабатывать форму:

if(isset($_POST['register'])) 
{ 
    //Process 
} 
+1

Вы назначили событие click для элемента, которого у вас нет на странице - '# register' –

+0

@JayBlanchard Извините, отредактировал его. – Dyan

+0

Это кажется слишком сложным и не деградирует изящно. Просто добавьте form.submit() в исходный код и отключите кнопку ... И даже это не должно быть необходимо (отметьте http://stackoverflow.com/a/13606633/4397981). Я попробую ваш код позже, чтобы проверить мое собственное здравомыслие :) – TacoV

0

Если вы используете JQuery версии 1.6 или более поздней версии, вы должны использовать метод .prop() для изменения свойств:

$('#register-form').submit(function(){ 
    $(this).find(":submit").prop("disabled", true); 
}); 

Вот example

+0

Даже с '.prop()' форма не обрабатывается. – Dyan

+0

См. Обновленный ответ @Dyan - я все еще печатал :-) –

+0

Спасибо за ваш ответ, но даже с помощью кнопки 'button' на' input' PHP не может обработать форму. :/ – Dyan

0

Может быть, это может сработать.

HTML:

<form action="<?=$_SERVER['PHP_SELF']?>" method="post"> 
<input name='register' type='submit' id="register-form" />Register 
//I remove the **ID Attribute** from the form and put it in the button. 

Jquery:

$('#register-form').on('submit', function(){ 
    $(this).attr('disabled', true); 
}); 

Или, как Jay Blanchard сказал, что если версия 1,6

$('#register-form').on('submit', function(){ 
    $(this).prop('disabled', true); 
}); 
+0

С вашим кодом отправляется форма, и я получаю ответ PHP, но кнопка не отключена ... затем я изменил в '$ ('регистровой формы #') нажмите (функция() { \t \t \t $ (это) .prop ('отключено', правда); \t}.); 'и кнопка отключена, но у меня нет ответа PHP. Боже, это заставляет меня потерять рассудок. – Dyan

+0

Я нашел решение для достижения того, что мне нужно, и отправил в качестве ответа здесь. – Dyan

0

Я думаю, что вам нужно это решение:

<html> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"> </script> 
    <script src="http://malsup.github.com/jquery.form.js"></script> 

    <script> 
    // wait for the DOM to be loaded 
    $(document).ready(function() { 
     // bind 'myForm' and provide a simple callback function 
     $('#register-form').ajaxForm(function() { 

      $('#register-form').find(":submit").prop("disabled", true); 

     }); 
    }); 
    </script> 
    </head> 

    <form id="register-form" action="<?=$_SERVER['PHP_SELF']?>" method="post"> 
    <label>Name <span style='color: red'>*</span><br/> 
    <input type='text' name='user_name'/> 
    </label> 
    <label>Email <span style='color: red'>*</span><br/> 
    <input type='text' name='user_email'/> 
    </label> 
    //Another form elements 
    <input type='hidden' name='register'/> 
    <button id='register'>Register</button> 
    </form> 

Я получил его отсюда http://malsup.com/jquery/form/

пожалуйста, попробуйте изменить действие целевой страницы, а не на той же странице, затем сделайте любой запрос, чтобы вставить эти постпеременные переменные, чтобы убедиться, что они были размещены правильно.

0

В вашей форме введите идентификатор в свою кнопку и класс в своей форме ,

<form class='Register-form' id="register-form" action="<?=$_SERVER['PHP_SELF']?>" method="post"> 
    <button id='Register' name='register' type='submit'>Register</button> 
</form> 

В функции

$('form.Register-form #Register').click(function(e){ 
    e.preventDefault(); 
    $('#register-form').submit(); 
    $(this).prop('disabled', true); 
}); 
Смежные вопросы