2011-09-12 28 views
2

入力フィールド内にテキストを入力して、そのページを更新せずに同じページに出力しようとしています。しかし、それは私がしたいことをしていない。私はプレースホルダ要素も持っているので、フィールドに何も入力しなくても、プレースホルダテキストをデータベース(mysql)に挿入することはありません。私が持っている問題は、私がenterを押すと、ページが更新され、成功したときに警告を出そうとしているときに警告しないということです。入力を押すとajax投稿フォームに問題が発生する

-------------------- ------------------以下のjQuery

$('[placeholder]').parents('form').submit(function() { 
    $(this).find('[placeholder]').each(function() { 
    var input = $(this); 
    if (input.val() == input.attr('placeholder')) { 
     input.val(''); 
    } 

    }); 

    var input = $('input.to_do').val(); 

    dataList = 'list=' + input; 
    $.ajax({ 
     type: "POST", 
     url: "ajax_table_edit.php", 
     data: dataList, 
     cache: false, 
     success: function(html) 
      { 
       alert(input); 
       //$('.to_do_list_').html(data); 
       //$('.n').hide(); 
      } 
    }); 
}); 

-------------------------- html以下--------------------

<form action='#' method='post' > 
<input type="text" class="to_do shadow" placeholder="enter text"/> 
</form> 

ありがとうございました!

答えて

3

防ぐデフォルトのイベント動作:

$('[placeholder]').parents('form').submit(function(event) { 
    $(this).find('[placeholder]').each(function() { 
    var input = $(this); 
    if (input.val() == input.attr('placeholder')) { 
     input.val(''); 
    } 

    }); 

    var input = $('input.to_do').val(); 

    dataList = 'list=' + input; 
    $.ajax({ 
     type: "POST", 
     url: "ajax_table_edit.php", 
     data: dataList, 
     cache: false, 
     success: function(html) 
      { 
       alert(input); 
       //$('.to_do_list_').html(data); 
       //$('.n').hide(); 
      } 
    }); 

    event.preventDefault(); 
}); 
3

return falseを関数の最後に追加して、ページがデフォルトの送信アクションを実行しないようにします。このよう

$('[placeholder]').parents('form').submit(function() { 
    $(this).find('[placeholder]').each(function() { 
    var input = $(this); 
    if (input.val() == input.attr('placeholder')) { 
     input.val(''); 
    } 

    }); 

    var input = $('input.to_do').val(); 

    dataList = 'list=' + input; 
    $.ajax({ 
     type: "POST", 
     url: "ajax_table_edit.php", 
     data: dataList, 
     cache: false, 
     success: function(html) 
      { 
       alert(input); 
       //$('.to_do_list_').html(data); 
       //$('.n').hide(); 
      } 
    }); 

    return false; 
}); 
関連する問題