如何弹出后ajax "成功"

how to popup after ajax "success:"

本文关键字:quot 成功 ajax 何弹出      更新时间:2023-09-26

我有一个按钮,当我点击这个按钮,它会去ajax。在成功条件下,它为'data'返回三个值,分别是1、2、3。我想弹出一个登录表单只有当数据=1。(如果用户未登录)。请帮帮我。

 <button data-toggle="modal" data-target="#xmpModal" class="btn green btn-success" onclick="get('<?echo $u_id;?>','<?echo $e_id;?>')">click</button>

弹出div

   <div class="modal fade" id="exmpModal" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true">
              <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                        <h3 class="modal-title" id="lineModalLabel">My Modal</h3>
                    </div>
                    <div class="modal-body">
                        <!-- content goes here -->
                        <form>
                          <div class="form-group">
                            <label for="exampleInputEmail1">Email address</label>
                            <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter email">
                        </div>
                        <div class="form-group">
                            <label for="exampleInputPassword1">Password</label>
                            <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
                        </div>
                      <button type="submit" class="btn btn-default">Submit</button>
                  </form>
              </div>
              <div class="modal-footer">
                <div class="btn-group btn-group-justified" role="group" aria-label="group button">
                    <div class="btn-group" role="group">
                        <button type="button" class="btn btn-default" data-dismiss="modal"  role="button">Close</button>
                    </div>
                    <div class="btn-group btn-delete hidden" role="group">
                        <button type="button" id="delImage" class="btn btn-default btn-hover-red" data-dismiss="modal"  role="button">Delete</button>
                    </div>
                    <div class="btn-group" role="group">
                        <button type="button" id="saveImage" class="btn btn-default btn-hover-green" data-action="save" role="button">Save</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

  function get(u_id,e_id)
{
    $.ajax({
        url: "<?echo base_url()?>events/xyz",
        type: 'post',   // HTTP METHOD
        data: 
        {u_id:u_id,e_id:e_id  },

        success: function(data)
        {  
             //alert(data);  
            if(data==1) 
            {
                // add your code pls
            }                                    
           else if(data==2)
           {
                alert("hai");
           }
           else if(data==3)   
           {
             alert("hello"); 
           }        
        }
      });
  }

my function in php controller

    public function xyz()
{      
    $u_id=$this->input->post('u_id');
    $e_id=$this->input->post('e_id');        
    $temp=$this->session->userdata('user');
    $g=$this->xm->is_going($u_id,$e_id);
    $g1=$this->xm->is_going1($u_id,$e_id);
    if($temp=="")
    {          
       $d=1;
       echo $d;
    }
    else if($g==$u_id)
        {
           $d=2;
           echo $d;
        }
        else if($g1==$u_id)
            {
                $d=3;
                echo $d;
                $this->xm->event_updation($e_id,$u_id);
            }
            else
            {           
                $data=array('event_id'=>$e_id,'ev_going'=>$u_id);             
                $this->xm->eventgoing($data);          
     }
   } 

我假设你得到1, 2, 3正确,可以操纵他们,所以只需要做的是显示modal

if($data == 2){
    $('#exmpModal').modal('show');
}

你可以在这里阅读更多关于Modal的信息

更特别的

你需要像这样从控制器返回json:

我不知道你用了什么框架,但这个例子是laravel框架当返回json。

return Response::json(array('response'=>'values')); 

在js的success函数中:

success: function(data)
        { 
            if(data.response==1) 
            {
                // add your code pls
            }                                    
           else if(data.response==2)
           {
                alert("hai");
           }
           else if(data.response==3)   
           {
             alert("hello"); 
           }        
        }

首先,重新检查从data返回的值是否符合您的期望,然后您可以参考这篇文章如何显示弹出登录对话框。请注意,在执行此操作之前,您必须编写一些代码来检查用户登录状态

使用jQuery创建一个简单的登录表单