Question

我正在尝试创建一个由ajax提交的更新状态按钮，但每次更新状态时，我都会在base_url().'/Admin/Jobs/'上重定向。可以在不获得重定向的情况下更新状态吗？

代码：

<?php if ($key['status'] === '1'): ?>
<?php echo form_open('Admin/update_job_status'); ?>
<input type="hidden" name="id" value="<?= $key['id'] ?>">
<input type="hidden" name="status" value="0">
<button class="btn btn-success btn-simple" id="submit" rel="tooltip" title="Status Active">
    <i class="fas fa-eye"></i>
</button>
<?php echo form_close(); ?>
<script>
    $(document).ready(function(){
        $('#submit').on('click', function(){
            var formData = {
            'id'  : $('#id').val(),
            'status'    :      $('#status').val()
            }
            $.ajax({
                type: 'post',
                data: formData,
                url: '<?php echo base_url().'/Admin/Jobs/' ?>',
                success: function(data){
                    alert(id);
                },
            });
        });
    });
</script>
<?php endif ?>

<?php if (is_null($key['status']) || $key['status'] === '0'): ?>
<?php echo form_open('Admin/update_job_status'); ?>
<input type="hidden" name="id" value="<?= $key['id'] ?>">
<input type="hidden" name="status" value="1">
<button class="btn btn-warning btn-simple" rel="tooltip" title="Status Inactive">
    <i class="fas fa-eye-slash "></i>
</button>
<?php echo form_close(); ?>
<script>
    $(document).ready(function(){
        $('#submit').on('click', function(){
            var formData = {
            'id'  : $('#id').val(),
            'status'    :      $('#status').val()
            }
            $.ajax({
                type: 'post',
                data: formData,
                url: '<?php echo base_url().'/Admin/Jobs/' ?>',
                success: function(data){
                    alert(id);
                },
            });
        });
    });
</script>
<?php endif ?>

Answer 1

您提交的事件已发送，因为它未停止。您必须使用event.stopPropagation()来防止＆＃34;自然＆＃34;表格提交。

    $('#submit').on('click', function(event) { // add event parameter
       event.preventDefault(); // stop form submit
       //...

Answer 2

默认情况下，表单中的按钮是提交按钮，如果您单击该按钮，它会将您的表单发布回指定的网址。
您可以通过将type属性设置为按钮

，将按钮显式设置为普通按钮

<button type="button"...

或者您可以阻止表单通过事件处理程序中的JavaScript提交

$('#submit').on('click', function(event){
    event.preventDefault();// prevents the default action, which is submitting the html form
   ...

Answer 3

试试这个

$(document).ready(function(){
   $('#submit').on('click', function(){ 
      var formData = { 
            'id' : $('#id').val(), 
            'status' : $('#status').val() 
      } 
     $.ajax({ 
         type: 'post', 
         data: formData, 
         url: '<?php echo base_url().'/Admin/Jobs/' ?>', 
         success: function(data)  { alert(id); }, 
      }); 

      return false; // disable form submit

  }); });

Jquery重定向到另一个页面

3 个答案: