在输入框中更改后调用函数,由select选择

时间:2016-10-04 06:55:10

标签: javascript php jquery

我有一个选择框,在更改后触发一个脚本(并在输入文本字段中更改了日期):

$(window).load(function() {
  datum = function() {
    var platba = document.getElementById('payment').value;
    var today = new Date();
    var dd = today.getDate();
    var mm = today.getMonth() + 1; //January is 0!
    var yyyy = today.getFullYear();

    today = dd + '.' + mm + '.' + yyyy;
    if (payment = 'yes') { datet = today; }
    document.getElementById('datepayment').value = datet;

它工作得很好,但现在我需要调用一个jQuery函数将新值保存到dtb ...

这是通过以下脚本完成的(在整个表单中输入字段更改后自动生效):

<!--JQUERY-->
<script type='text/javascript'>
// JQUERY: Plugin 'autoSumbit'
(function($) {
    $.fn.autoSubmit = function(options) {
        return $.each(this, function() {
            // VARIABLES: Input-specific
            var input = $(this);
            var column = input.attr('name');

            // VARIABLES: Form-specific
            var form = input.parents('form');
            var method = form.attr('method');
            var action = form.attr('action');

            // VARIABLES: Where to update in database
            var where_val = form.find('#where').val();
            var where_col = form.find('#where').attr('name');

    // ONBLUR: Dynamic value send through Ajax
            input.bind('blur', function(event) {

                // Get latest value
                var value = input.val();

                // AJAX: Send values
                $.ajax({
                    url: action,
                    type: method,
                    data: {
                        val: value,
                        col: column,
                        w_col: where_col,
                        w_val: where_val
                    },
                    cache: false,
                    timeout: 10000,
                    success: function(data) {
                        // Alert if update failed
                        if (data) {
                            alert(data);
                        }
                        // Load output into a P
                        else {
                            $('#notice').text('Updated');
                            $('#notice').fadeOut().fadeIn();
                        }
                    }

                });
                // Prevent normal submission of form

      return false; 
            })
         //  
        });

    }
})(jQuery);
// JQUERY: Run .autoSubmit() on all INPUT fields within form
$(function(){
  $('#ajax-form INPUT').autoSubmit();
  $('#ajax-form SELECT').autoSubmit(); 
  $('#ajax-form TEXTAREA').autoSubmit();         
});
</script>

问题是:如何将字段datepayment中的值保存到数据库中而不点击进入它?感谢您的评论!

1 个答案:

答案 0 :(得分:0)

而不是

input.bind('blur', function(event) 

尝试

input.on('input', function() {

这是一个简单的例子:

<input type="text" id="input1"/> 
<input type="text" id="input2"/> 
<select id="input3">
<option value="ABC">ABC</option>
<option value="XYZ">XYZ</option>
</select>

$(document).ready(function() {
  $("#input1").on('input', function() { //'input' listener
    alert($("#input1").val());
  });
  $("#input2").on('input', function() { //'input' listener
    alert($("#input2").val());
  });
  $("#input3").on('change', function() { //'change' listener
    alert($("#input3").val());
  });
});

jsfiddle链接: https://jsfiddle.net/kannanore/xdat6axa/