1

Jqueryの検証が実際に成功した後、フォームが正常に送信されないようにする方法があるかどうか疑問に思っていました。

フォームの送信を処理する他の関数が必要です。フォームを検証したいが、送信しないでください。誰でも助けてくれることを願っています

私はVarienForm検証クラスを使用しています。

以下に例を示します。

var newform = new VarienForm('newform', true);

前もって感謝します。

ここに私のフォームがあります:

<form  id="newform" >
<div class="fieldset">
<h2 class="legend">User Details</h2>
    <ul class="form-list">
               <li class="fields">
            <div class="field">
                <label for="firstname" class="required"><em>*</em>First Name</label>
                <div class="input-box">
                    <input name="firstname" id="firstname" title="First Name of Staff" value="<?php  if (isset($user->firstname)){ echo $user->firstname; } ?>" class="input-text required-entry" type="text"  tabindex="1"/>
                </div>
            </div>
            <div class="field">
                <label for="lastname" class="required"><em>*</em>Last Name</label>
                <div class="input-box">
                    <input name="lastname" id="lastname" title="Last Name of Staff" value="<?php  if (isset($user->lastname)){ echo $user->lastname; } ?>" class="input-text required-entry" type="text"  tabindex="2"/>
                </div>
            </div>
        </li>
          <li class="fields">
            <div class="field">
                <label for="othername" class="required"><em>*</em>Other Name (s)</label>
                <div class="input-box">
                    <input name="othername" id="othernames" title="Other Name(s)" value="<?php  if (isset($user->othername)){ echo $user->othername; } ?>" class="input-text" type="text" tabindex="3"/>
                </div>
            </div>
                 <div class="field">
                <label for="phone" class="required"><em>*</em>Phone Number</label>
                <div class="input-box">
                    <input name="phone" id="phone" title="Phone Number" value="<?php  if (isset($user->phone)){ echo $user->phone; } ?>" class="input-text validate-number" type="text" tabindex="4"/>
                </div>
            </div>
        </li>
        <li class="fields">
            <div class="field">
                <label for="username" class="required"><em>*</em>User Name</label>
                <div class="input-box">
                    <input name="username" id="username" title="User Name" value="<?php  if (isset($user->username)){ echo $user->username; } ?>" class="input-text required-entry" type="text" tabindex="5" />
                </div>
            </div>
             <div class="field">
                <label for="email" class="required"><em>*</em>Email</label>
                <div class="input-box">
                    <input name="email" id="email" title="User Email" value="<?php  if (isset($user->email)){ echo $user->email; } ?>" class="input-text validate-email" type="text" tabindex="6" />
                </div>
            </div>
        </li>
        <li class="fields">
            <div class="field">
                <label for="password" class="required"><em>*</em> Password</label>
                <div class="input-box">
                    <input name="password" id="password" title="Password" value="<?php //  if (isset($user->password2)){ echo $user->password2d; } ?>" class="input-text validate-password required-entry" type="password" tabindex="7"/>
                </div>
            </div>
                <div class="field">
                <label for="password2" class="required"><em>*</em>Confirm Password</label>
                <div class="input-box">
                    <input name="password2" id="password" title="Confirm Password" value="<?php //  if (isset($user->password2)){ echo $user->password2; } ?>" class="input-text validate-password required-entry validate-cpassword" type="password" tabindex="8"/>
                </div>
            </div>
        </li>

     <li class="fields">
            <div class="field">
                <label for="Role" class="required"><em>*</em>Role</label>
                <div class="input-box">
                            <?php  $roles = Role::find_all(); if ($roles){  ?>
    <select name="role" id="role" class="required-entry" tabindex="9" value="">
          <option value="" selected="selected">SELECT ROLE</option>
<?php   foreach ($roles as $role) :  ?>
            <option value="<?php echo $role->id;  ?>"><?php echo $role->name ?></option>
<?php Endforeach; ?>
    </select>
          <?php } else { echo "No Roles Found! Add Role";  } ?>
                </div>
            </div>
       <div class="field">
                <label for="Status" class="required"><em>*</em>Status</label>
                <div class="input-box">
    <select name="status" id="status" class="required-entry" tabindex="10" value="">
            <option value="1" selected="selected">Active</option>
            <option value="0">Inactive</option>
</select>
                </div>
            </div>
        </li>         

    </ul>
 <div class="buttons-set">
    <input type="text" name="hideit" id="hideit" value="" style="display:none !important;" />
    <input type="submit" name="submit" value="SAVE" class="buttons-set" />
</div>
</div>
</form>
4

4 に答える 4

1

jQuery にタグを付けたので、jquery ソリューションを提供します。

$("#newform").submit(function() {
    return false;
});

同様に、このバリエーションを使用できます (実際には、これが正しい方法です)。

$(document).ready(function() {
     // I'm not familiar with VarienForm
     // but the statement below runs once all DOM elements
     // become available.
     var newform = new VarienForm('newform', true);

     // The block of code below only runs after you click
     // the submit button in your form with id="newForm"
     $("#newform").submit(function(e) {
         // you can put a condition here, for example:
         // if your form validation is correct return true;
         // otherwise run e.preventDefault()
         e.preventDefault();
     });
});
于 2013-07-18T13:35:01.827 に答える
0

まず、私が以下に書いたコードを見てください：

var x=true;
$('#newform').submit(function(e){
    if(x) e.preventDefault();
    myfun($(this));
});

function myfun(p) {
    //lots of work...(simulating with timeout it could be anything ie. 2*2*2...)
    setTimeout(function(){
        x=false;
        p.submit();
     },1000);
}

デモへのリンク: >>> http://jsfiddle.net/techsin/QwWfb/

主なアイデアは、停止したいときに実行を停止します...しかし、何かをした後に送信する準備ができたら、停止機能にそれがもう必要ないことを知らせます。したがって、submit を呼び出すと、実際に実行されます。

x送信を制御するための制御。

于 2013-08-26T04:40:12.347 に答える