根據onclick中的參數顯示jQuery-ui對話框

Question

我有一組來自PHP循環的鏈接，每個鏈接都有一個onclick()函數，該函數包含一個數字作為參數。

echo '<a href="#" id="'.$id.'" onclick="openModel('.$id.')">'.$name.'</a>';

因此，當用戶單擊鏈接時，我希望彈出一個jQuery-ui對話框並顯示與特定鏈接相關的信息。

該信息在數據庫中，並將根據$id I'進行查詢，並傳入onclick函數。

這是打開jQuery對話框的代碼

function openModel(id){
    var dialog, form;

        dialog = jQuery( "#dialog-form-text-box" ).dialog({
          autoOpen: false,
          height: 300,
          width: 350,
          modal: true,
          buttons: {
            "Done": function() {
              dialog.dialog( "close" );
            }
          },

        });

    form = dialog.find( "form" ).on( "submit", function( event ) {
      event.preventDefault();
    });

   dialog.dialog( "open" );
}

這是jQuery對話框中的代碼

<div id="dialog-form-text-box" title="Text Box">
    <p id="mini-title"></p>
  <form>
      <input type="text" name="textbox-title" id="textbox-title" value="<?php echo $parsedArr[0]['content']['title'] ?>" placeholder="Title"> <br> <br>
      <textarea name="textbox-desc" id="textbox-desc" placeholder="Description"><?php echo $parsedArr[4]['content']['content'] ?></textarea>
  </form>
</div>

那么，這樣做的方式是什么？

Answer 1

您需要使用AJAX作為ID從服務器檢索內容。

嘗試類似的東西：

<html>
 <head>
  <meta charset="utf-8">
  <title>jQuery UI with Ajax</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
  <script>
   $(document).ready(function(){
      $(".dialog").on("click", function(){
        var id = $(this).attr("id");
        $.ajax({
            url: "content.php?id="+id,
            success: function(data){
                $("#dialog").html(data);
            }   
        });

        $( "#dialog" ).dialog({
          modal: true,
          buttons: {
            Ok: function() {
              $( this ).dialog( "close" );
            }
          }
        });

      });
   });

  </script>
</head>
<body>

<div id="dialog" title="My Content">
  <!--Your Content-->
</div>

 <h2><a href="#" id="1" class="dialog">Link 1</a></h2>
 <h2><a href="#" id="2" class="dialog">Link 2</a></h2>
 <h2><a href="#" id="3" class="dialog">Link 3</a></h2>
 <h2><a href="#" id="4" class="dialog">Link 4</a></h2>
 <h2><a href="#" id="5" class="dialog">Link 5</a></h2>

</body>
</html>


Content.php

<?php

$id = $_REQUEST['id'];

echo "Data From the server for id ".$id;

?>

根據onclick中的參數顯示jQuery-ui對話框

問題描述

1 個解決方案

解決方案1
0 2016-01-18 10:54:59

根據onclick中的參數顯示jQuery-ui對話框

問題描述

1 個解決方案

解決方案1 0 2016-01-18 10:54:59

解決方案1
0 2016-01-18 10:54:59