我在我的页面中创建了一个模态对话框,它包含一个表单。单击按钮后我想有一个 AJAX 进程。现在我的问题是我无法在我的模态中获取输入值。
这是我的代码:
我在onclick中的代码
$('.order_concern').on('click', function(){
var order_id = $(this).data('order-id');
var product_id = $(this).data('product-id');
var product_name = $(this).data('product-name');
var seller_id = $(this).data('seller-id');
var seller_name = $(this).data('seller-name');
var customer_id = <?php echo $customer_id; ?>
var concern_form = '<div class="row">';
concern_form += ' <div class="form-group">';
concern_form += ' <label>Product</label>';
concern_form += ' <input type="text" class="form-control input-sm" style="width: 97%" name="response_product" value="' + product_name + '" READONLY />';
concern_form += ' </div>';
concern_form += '</div>';
concern_form += '<div class="row">';
concern_form += ' <div class="form-group">';
concern_form += ' <label>Seller Name</label>';
concern_form += ' <input type="text" class="form-control input-sm" style="width: 97%" name="response_seller_name" value="' + seller_name + '" READONLY />';
concern_form += ' </div>';
concern_form += '</div>';
concern_form += '<div class="row">';
concern_form += ' <div class="form-group">';
concern_form += ' <label>Select Concern</label>';
concern_form += ' <select class="form-control" style="width: 97%" name="response_status">';
concern_form += ' <option value="">-- Select Concern --</option>';
concern_form += ' <option value="Product not received">Product not received</option>';
concern_form += ' <option value="Product has defect">Product has defect</option>';
concern_form += ' <option value="Product did not reached the quantity of the order">Product did not reached the quantity of the order</option>';
concern_form += ' <option value="Invalid product(request to replace)">Invalid product(request to replace)</option>';
concern_form += ' <option value="Request to cancel"></option>';
concern_form += ' </select>';
concern_form += ' </div>';
concern_form += '</div>';
concern_form += '<div class="row">';
concern_form += ' <div class="form-group">';
concern_form += ' <label>Message to seller</label>';
concern_form += ' <textarea class="form-control" style="width: 97%" name="response_message"></textarea>';
concern_form += ' </div>';
concern_form += '</div>';
concern_form += '<div class="row">';
concern_form += ' <div class="form-group">';
concern_form += ' <label class="required response_alert"></label>';
concern_form += ' </div>';
concern_form += '</div>';
var concern_buttons = '<input type="button" class="btn-jpmall" value="Send" onClick="sendConcernStatus(' + order_id + ', ' + product_id + ', ' + customer_id + ')" /> ';
concern_buttons += '<input type="button" class="btn-jpmall-inverse" data-dismiss="modal" value="Cancel" />';
$('.modal_concern .modal-title').text('Inform Seller');
$('.modal_concern .message').html(concern_form);
$('.modal_concern .modal_buttons').html(concern_buttons);
$('.modal_concern').modal('show');
});
现在我想获取这个输入中的值:
concern_form += ' <input type="text" class="form-control input-sm" style="width: 97%" name="response_product" value="' + product_name + '" READONLY />';
然后在我单击模态框内的按钮后:
var concern_buttons = '<input type="button" class="btn-jpmall" value="Send" onClick="sendConcernStatus(' + order_id + ', ' + product_id + ', ' + customer_id + ')" /> ';
我将访问此功能:
function sendConcernStatus(order_id, product_id, customer_id) {
var container = $('.modal concern .message');
var product_name =$('.modal concern .modal-content .modal-body .mesage input[name=response_product]').val();
console.log(product_name);
}
但是我得到了一个 undefined
值。
最佳答案
你有一些拼写错误 .message
应该是 .message
和
.modal concern
应该是 .modal_concern
无论如何我猜你可以直接通过-name
function sendConcernStatus( /*arguments here*/ ) {
var product_name = $('.modal_concern').find('input[name="response_product"]').val();
console.log(product_name); // works
}
此外,要利用您的 JS,请使用 \n\
来拆分字符串换行符:
var concern_form = '<div class="row">\n\
<div class="form-group">\n\
<label>Product</label>\n\
<input type="text" class="form-control input-sm" style="width: 97%" name="response_product" value="' + product_name + '" READONLY />\n\
</div>\n\
</div>';
关于javascript - 如何通过单击事件之外的函数访问模态中的输入值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30609313/