javascript - 如何将 id 从一个弹出窗口发送到另一个弹出窗口？

标签 javascript css codeigniter popup

我正在使用 codeigniter。我有一个纯粹使用 CSS 的弹出窗口。当我单击添加按钮时，会打开一个弹出窗口，在单击选择按钮时我有一个选择按钮，我需要将 id 从该弹出窗口获取到下一个弹出窗口。没有弹出窗口，我使用 uri 在我的 Controller 页面中获取 id。如何编码。

我的 Controller :

<?php
class Admin_billing extends CI_Controller {

    public function index()
    {
        $data['client']=$this->client_model->ticket_info();
        $data['bill']=$this->billing_model->get_bill();
        $data['main_content'] = 'admin/billing/list';
        $this->load->view('includes/template', $data);  

    }
    public function client_info()
    {

        $data['client']=$this->client_model->ticket_info();
        $data['main_content'] = 'admin/billing/client_info';
        $this->load->view('includes/template', $data);  

    }
    public function ticket($id)
    {
        $id=$this->uri->segment(4);
        $data['id']=$this->uri->segment(4);
        $data['client']=$this->billing_model->get_cli_first_name($id);
        $data['last_name']=$this->billing_model->get_cli_last_name($id);
        $data['employee']=$this->employee_model->emp_name();
        $data['main_content'] = 'admin/billing/ticket_page';
        $this->load->view('includes/template', $data);  
     }
}

在这个 Controller 类中。这里我有 ticket 函数，我可以在其中获取我的 id 并在 ticket_page 中使用它。但是现在我在单个页面中拥有所有内容，但在弹出窗口中。 这是我触发弹出窗口的脚本。

<script>
function myFunction() {

    document.getElementById("myDIV").style.display = "inline";

}
function myFunction1() {
    document.getElementById("myDIV1").style.display = "inline";

}
function myclose() {
 document.getElementById("myDIV").style.display = "none";
}

</script>

弹出窗口的 CSS。

#myDIV {

    position: fixed;
    top: 40px;
    left: 7px;
    width: 1212px;
    height: 620px;
    display: none;
    z-index: 600;

}
#myDIV1 {


    position: fixed;
    top: 40px;
    left: 7px;
    width: 1212px;
    height: 620px;
    display: none;
    z-index: 800;

}
#shadow {


    position: fixed;
    top: 47px;
    left: 213px;
    width: 801px;
    height: 570px;
-webkit-box-shadow: 9px 5px 27px 5px rgba(71,68,71,0.57);
-moz-box-shadow: 9px 5px 27px 5px rgba(71,68,71,0.57);
box-shadow: 9px 5px 27px 5px rgba(71,68,71,0.57);


}

#privacy-stat {
    background: rgba(254,254,254,0.9);
    position: fixed;
    width: 759px;
    height: 500px;
    overflow: auto;
    top: 75px;
    margin: auto;
    padding: 20px;
    left: 213px;
    border-width: 1px;
    border-style: solid;
    border-bottom-color: #666666;
    border-left-color: #666666;
    border-top-color: #666666;
    border-right-color: #666666;


}
#title-bar {
    background-color: #CCCCCC;
    width: 799px;
    height: 27px;
    position: fixed;
    left: 213px;
    top: 47px;
    border-width: 1px;
    border-style: solid;
    border-bottom: none;
    border-left-color: #666666;
    border-top-color: #666666;
    border-right-color: #666666;
    z-index:800;


}

#close {
position:fixed;

    width: 26px;
    height: 26px;
    position: relative;
    left: 769px;
    top: -1px;



}

我的 View 文件。

<a onClick="myFunction()" href="javacsript:void(0);" class="button"><span>ADD BILL</span></a>
<!--myDiv start-->  
<div id="myDIV">
<!--Shadow div start--> 
<div id="shadow">
<div id="title-bar">
<!--Close div start-->  
<div id="close">
<a href=""><img src="<?php echo base_url(); ?>assets/img/cancel.svg" height="30" width="30"/></a>
</div>
<!--Close div end-->    
</div>
<!--Title bar end-->
<!--Privacy-stat div start-->   
<div id="privacy-stat">
<!---->
<div id="main1">
<div id="add-contents">
<div id="add-main-contents1">

<hr/>
<div id="popuptable">
<table id="example">

         <thead>
              <tr>
              <th>Client Id</th>
                <th>First Name</th>
                <th>Last Name</th>
                <th>Address</th>
                <th>Home</th>

                <th>Actions</th>
              </tr>
            </thead>
            <tbody>
              <?php
              foreach($client as $row)
              {
                echo '<tr>';
                echo '<td>'.$row['id'].'</td>';
                echo '<td>'.$row['first_name'].'</td>';
                echo '<td>'.$row['last_name'].'</td>';
                  echo '<td>'.$row['address'].'</td>';
                  echo '<td>'.$row['mobile_no'].'</td>';
                echo '<td>

                  <a onclick="myFunction1()" class="button"><span>Select</span></a>
                </td>';
                echo '</tr>';
              }
              ?>      
            </tbody>
          </table>
         </div>






</div>
<!--Privacy-stat end-->
</div>
<!--Shadow end-->
</div>


<!--myDiv start-->  
<div id="myDIV1">
<!--Shadow div start--> 
<div id="shadow">
<div id="title-bar">
<!--Close div start-->  
<div id="close">
<a href=""><img src="<?php echo base_url(); ?>assets/img/cancel.svg" height="30" width="30"/></a>
</div>
<!--Close div end-->    
</div>
<!--Title bar end-->
<!--Privacy-stat div start-->   
<div id="privacy-stat">
<!---->
<div id="main1">
<div id="add-contents">
<div id="add-main-contents1">

 <?php
      //flash messages
      if(isset($flash_message)){
        if($flash_message == TRUE)
        {
          echo '<div class="alert alert-success">';
            echo '<a class="close" data-dismiss="alert"></a>';
            echo '<strong>Well done!</strong> new service created with success.';
          echo '</div>';       
        }else{
          echo '<div class="alert alert-error">';
            echo '<a class="close" data-dismiss="alert"></a>';
            echo '<strong>Oh snap!</strong> change a few things up and try submitting again.';
          echo '</div>';          
        }
      }
      ?>

      <?php
      //form data
      $attributes = array('class' => 'form-horizontal', 'id' => '');
      $options_category = array('' => "Select");
      foreach ($employee as $row)
      {
        $options_category[$row['emp_first_name']] = $row['emp_first_name'];
      }
      $indiatimezone = new DateTimeZone("Asia/Kolkata" );
    $date = new DateTime();
    $date->setTimezone($indiatimezone);

        $query = $this->db->query('SELECT CURTIME()');

      //form validation
      echo validation_errors();

      echo form_open('admin/billing/ticket_page', $attributes);
      ?>
  <div id="ticket"> 

<table style=" border-collapse: collapse;">
        <tr>
        <th>Employee</th>
        <th>Start Time</th>
        </tr>
        <tr>

        <td> <?php  echo form_dropdown('employee', $options_category, set_value('employee'),'style="border-radius:0px; width:60px"');?></td>
        <td>    <input type="text" id="" name="start_time"  style="width:70px; border-radius: 0px;" value="<?php echo  $date->format( 'H:i' ); ?>" ></td>

        </tr>

    </table>
</div>
    <fieldset id="sett2">
            <button class="btn btn-primary" type="submit">Schedule/Leave open</button>
            <button class="btn" type="reset">Checkout/Close</button>
    </fieldset>     





      <?php echo form_close(); ?>

    </div>




</div>
<!--Privacy-stat end-->
</div>
<!--Shadow end-->
</div>

在此 View 中，当我单击 Add 时调用 myDiv，当单击选择时调用 myDiv1。

  function myFunction() { document.getElementById("myDIV").style.display = "inline"; } function myFunction1() { document.getElementById("myDIV1").style.display = "inline"; } function myclose() { document.getElementById("myDIV").style.display = "none"; }
#myDIV {
  position: fixed;
  top: 40px;
  left: 7px;
  width: 1212px;
  height: 620px;
  display: none;
  z-index: 600;
}
#myDIV1 {
  position: fixed;
  top: 40px;
  left: 7px;
  width: 1212px;
  height: 620px;
  display: none;
  z-index: 800;
}
#shadow {
  position: fixed;
  top: 47px;
  left: 213px;
  width: 801px;
  height: 570px;
  -webkit-box-shadow: 9px 5px 27px 5px rgba(71, 68, 71, 0.57);
  -moz-box-shadow: 9px 5px 27px 5px rgba(71, 68, 71, 0.57);
  box-shadow: 9px 5px 27px 5px rgba(71, 68, 71, 0.57);
}
#privacy-stat {
  background: rgba(254, 254, 254, 0.9);
  position: fixed;
  width: 759px;
  height: 500px;
  overflow: auto;
  top: 75px;
  margin: auto;
  padding: 20px;
  left: 213px;
  border-width: 1px;
  border-style: solid;
  border-bottom-color: #666666;
  border-left-color: #666666;
  border-top-color: #666666;
  border-right-color: #666666;
}
#title-bar {
  background-color: #CCCCCC;
  width: 799px;
  height: 27px;
  position: fixed;
  left: 213px;
  top: 47px;
  border-width: 1px;
  border-style: solid;
  border-bottom: none;
  border-left-color: #666666;
  border-top-color: #666666;
  border-right-color: #666666;
  z-index: 800;
}
#close {
  position: fixed;
  width: 26px;
  height: 26px;
  position: relative;
  left: 769px;
  top: -1px;
}
    <a onClick="myFunction()" href="javacsript:void(0);" class="button"><span>ADD BILL</span></a>
    <!--myDiv start-->
    <div id="myDIV">
      <!--Shadow div start-->
      <div id="shadow">
        <div id="title-bar">
          <!--Close div start-->
          <div id="close">
            <a href=""><img src="<?php echo base_url(); ?>assets/img/cancel.svg" height="30" width="30"/></a>
          </div>
          <!--Close div end-->
        </div>
        <!--Title bar end-->
        <!--Privacy-stat div start-->
        <div id="privacy-stat">
          <!---->
          <div id="main1">
            <div id="add-contents">
              <div id="add-main-contents1">

                <hr/>
                <div id="popuptable">
                  <table id="example">

                    <thead>
                      <tr>
                        <th>Client Id</th>
                        <th>First Name</th>
                        <th>Last Name</th>
                        <th>Address</th>
                        <th>Home</th>

                        <th>Actions</th>
                      </tr>
                    </thead>
                    <tbody>
                      <?php foreach($client as $row) { echo '<tr>'; echo '<td>'.$row[ 'id']. '</td>'; echo '<td>'.$row[ 'first_name']. '</td>'; echo '<td>'.$row[ 'last_name']. '</td>'; echo '<td>'.$row[ 'address']. '</td>'; echo '<td>'.$row[ 'mobile_no']. '</td>'; echo '<td>

                  <a onclick="myFunction1()" class="button"><span>Select</span></a>
                </td>'; echo '</tr>'; } ?>
                    </tbody>
                  </table>
                </div>






              </div>
              <!--Privacy-stat end-->
            </div>
            <!--Shadow end-->
          </div>


          <!--myDiv start-->
          <div id="myDIV1">
            <!--Shadow div start-->
            <div id="shadow">
              <div id="title-bar">
                <!--Close div start-->
                <div id="close">
                  <a href=""><img src="<?php echo base_url(); ?>assets/img/cancel.svg" height="30" width="30"/></a>
                </div>
                <!--Close div end-->
              </div>
              <!--Title bar end-->
              <!--Privacy-stat div start-->
              <div id="privacy-stat">
                <!---->
                <div id="main1">
                  <div id="add-contents">
                    <div id="add-main-contents1">

                      <?php //flash messages if(isset($flash_message)){ if($flash_message==T RUE) { echo '<div class="alert alert-success">'; echo '<a class="close" data-dismiss="alert"></a>'; echo '<strong>Well done!</strong> new service created with success.'; echo
                      '</div>'; }else{ echo '<div class="alert alert-error">'; echo '<a class="close" data-dismiss="alert"></a>'; echo '<strong>Oh snap!</strong> change a few things up and try submitting again.'; echo '</div>'; } } ?>

                      <?php //form data $attributes=a rray( 'class'=>'form-horizontal', 'id' => ''); $options_category = array('' => "Select"); foreach ($employee as $row) { $options_category[$row['emp_first_name']] = $row['emp_first_name']; } $indiatimezone = new DateTimeZone("Asia/Kolkata" ); $date
                      = new DateTime(); $date->setTimezone($indiatimezone); $query = $this->db->query('SELECT CURTIME()'); //form validation echo validation_errors(); echo form_open('admin/billing/ticket_page', $attributes); ?>
                      <div id="ticket">

                        <table style=" border-collapse: collapse;">
                          <tr>
                            <th>Employee</th>
                            <th>Start Time</th>
                          </tr>
                          <tr>

                            <td>
                              <?php echo form_dropdown( 'employee', $options_category, set_value( 'employee'), 'style="border-radius:0px; width:60px"');?>
                            </td>
                            <td>
                              <input type="text" id="" name="start_time" style="width:70px; border-radius: 0px;" value="<?php echo  $date->format( 'H:i' ); ?>">
                            </td>

                          </tr>

                        </table>
                      </div>
                      <fieldset id="sett2">
                        <button class="btn btn-primary" type="submit">Schedule/Leave open</button>
                        <button class="btn" type="reset">Checkout/Close</button>
                      </fieldset>





                      <?php echo form_close(); ?>

                    </div>




                  </div>
                  <!--Privacy-stat end-->
                </div>
                <!--Shadow end-->
              </div>

最佳答案

在第二个div中，有一个像这样的隐藏

<input type="hidden" id="hidd" />

$(document).on("click","id or class of button",function(){
    var value = $("id or class of button").attr("id");// you can store the required value with attribute id and use it.
    $("#hidd").val(value);
});

试试这个。

关于javascript - 如何将 id 从一个弹出窗口发送到另一个弹出窗口？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32201824/

上一篇：css - 具有 tbody 滚动问题的灵活表格

下一篇：html - iphone6 上的电子邮件应用程序测试

相关文章：

css - 具有固定元素的 z-index

php - 删除index.php并在htaccess Codeigniter中添加www

php - Codeigniter 事件记录类(从哪里选择)

将括号中的文本替换为标签的 Javascript，不适用于 &lt;style&gt;

javascript - Jquery Click 首先在 IBM Mobile 中不起作用

javascript - Vue - 从数组中拼接定位元素会将其偏移量应用于下一个索引

php - 如何获取最符合用户搜索条件的记录？

javascript - 如何检测JS参数是否有多余的文本？

html - 无法用css覆盖html中的直接attr

javascript - 选择元素在 CSS 中不起作用

©2024 IT工具网  联系我们