Question

我一直在我的项目中创建动态jquery ui标签。我能够在MYSQL数据库中添加选项卡的内容。但我也想在数据库中插入选项卡的“标题”。我怎么能这样做？

以下是我的Jquery代码：

<script>

    $(function() {
    var tabTitle = $( "#tab_title" ),
    tabContent = $( "#tab_content" ),
    tabTemplate = "<li><a href='#{href}'>#{label}</a> <span class='ui-icon ui-icon-close' role='presentation'>Remove Tab</span></li>",
    tabCounter = 2;

    var tabs = $( "#tabs" ).tabs();


// modal dialog init: custom buttons and a "close" callback reseting the form inside

    var dialog = $( "#dialog" ).dialog({
    autoOpen: false,
    modal: true,
    buttons: {
    Add: function() {
      addTab();
      $( this ).dialog( "close" );
    },
    Cancel: function() {
      $( this ).dialog( "close" );
    }
  },
  close: function() {
    form[ 0 ].reset();
  }
  });

// addTab form: calls addTab function on submit and closes the dialog

  var form = dialog.find( "form" ).submit(function( event ) {
  addTab();
  dialog.dialog( "close" );
  event.preventDefault();
  });

// actual addTab function: adds new tab using the input from the form above

   function addTab() {
   var label = tabTitle.val() || "Tab " + tabCounter,
   id = "tabs-" + tabCounter,
   li = $( tabTemplate.replace( /#\{href\}/g, "#" + id ).replace( /#\{label\}/g, label ) ),
   tabContentHtml = tabContent.val() || "Tab " + tabCounter + " content.";

  tabs.find( ".ui-tabs-nav" ).append( li ).sortable({
  axis: "x",
  stop: function() {
    tabs.tabs( "refresh" );
  }
});
  tabs.append( "<div id='" + id + "'><textarea id='txt' name= 'txt[]'>" + tabContentHtml + "</textarea></div>" );
  tabs.tabs( "refresh" );
  tabCounter++;
}

// addTab button: just opens the dialog

$( "#add_tab" )
  .button()
  .click(function() {
    dialog.dialog( "open" );
  });

// close icon: removing the tab on click

tabs.delegate( "span.ui-icon-close", "click", function() {
  var panelId = $( this ).closest( "li" ).remove().attr( "aria-controls" );
  $( "#" + panelId ).remove();
  tabs.tabs( "refresh" );
});

tabs.bind( "keyup", function( event ) {
  if ( event.altKey && event.keyCode === $.ui.keyCode.BACKSPACE ) {
    var panelId = tabs.find( ".ui-tabs-active" ).remove().attr( "aria-controls" );
    $( "#" + panelId ).remove();
    tabs.tabs( "refresh" );
  }
});

});

</script>

我试过的PHP代码：

if(isset($_POST['next']))
{

    $con = mysqli_connect("localhost","root","","my_db"); 
    $texts = $_POST['txt'];
    $title_tab= $_POST['title_tab'];
    $arrayCount = sizeof($texts);
    //echo $arrayCount;
    //print_r ($texts);  

for($i=0; $i < $arrayCount; $i++)  
      {

      $data= mysql_real_escape_string($texts[$i]); 
      $title = mysql_real_escape_string($title_tab[$i]); 
      $run= "INSERT INTO Sections(title,data) VALUES('$title','$data')";
      mysqli_query($con,$run);

  }
}

HTML：

<div id="dialog" title="Tab data">
     <form action="" method="post" enctype="multipart/form-data" name="f1"> 
        <fieldset class="ui-helper-reset">
          <label for="tab_title">Title</label>
          <input type="text" name="title_tab[]" id="tab_title" value="" class="ui-widget-content ui-corner-all">
          <label for="tab_content">Content</label>
          <textarea name="txt[]" id="tab_content" class="ui-widget-content ui-corner-all"></textarea>
        </fieldset>

</div>

<button id="add_tab">Add Tab</button>

<div id="tabs" style="width:1000px;">
  <ul>
    <li ><a href="#tabs-1" name="title_tab[]">About Us</a></li>
</li>
  </ul>
  <div id="tabs-1">
<textarea name="txt[]"  id="txt">
Infosys is a global leader in consulting, technology and outsourcing solutions. </textarea>

</div>
</div>
<input type="submit" id="sub" name="next" value="next" />
</form>

Answer 1

我没有阅读所有代码......但也许这与它有关？

$title_tab= $_POST['title'];

$title = mysql_real_escape_string(`$title`[$i]);

你的varibales名称有误。

将jquery ui tabs的'title'值添加到MYSQL中

1 个答案: