Verwenden von jquery easyui, wie erstellt man einen Tab durch einen Link, der sich in einem Tab befindet?

Tabs document Verwenden von jquery easyui, wie erstellt man einen Tab durch einen Link, der sich in einem Tab befindet?

Ich mag würde einen neuen Tab erstellen, die von der Verbindung, die in einem Tab ist.

zum Beispiel in der Registerkarte ein, dort einen Link "open Tab b" ist, und es sollte eine Registerkarte b hinzufügen,

habe ich versucht, die Art und Weise Registerkarte zu erstellen, dass, wenn die Verbindung nicht in Tab ist (das ist funktioniert)

jedoch, in diesem Fall, wenn ich es drücke, hat es keine Antwort. Danke

<a href='#' onclick="addTab('Manage List','list/view.php')" class='btn'>Manage List</a>

addTab Funktion

function addTab(title, url){ 
    if ($('#tt').tabs('exists', title)){ 
     $('#tt').tabs('select', title); 
    } else { 
     var content = '<iframe scrolling="auto" frameborder="0" src="'+url+'" style="width:100%;height:100%;"></iframe>'; 
     $('#tt').tabs('add',{ 
      title:title, 
      content:content, 
      closable:true 
     }); 
    } 
}

ganze Seite

<? 
include("../connection/conn.php"); 
session_start();?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 

<style type="text/css"> 
     @import "../plugin/easyui/themes/default/easyui.css"; 
     @import "../plugin/easyui/themes/icon.css"; 
     @import "../plugin/bootstrap/css/bootstrap.css"; 
     @import "../plugin/bootstrap/css/bootstrap-responsive.css"; 
     @import "../style/form.css"; 
</style> 
<script src="../plugin/jquery-1.6.1.min.js"></script> 
<script type="text/javascript" src="../plugin/easyui/jquery.easyui.min.js"></script> 
<script src="../plugin/jquery.validate.min.js"></script> 

<script> 
$(document).ready(function(){ 
$("#addlist").validate(); 
}); 

function addTab(title, url){ 
    if ($('#tt').tabs('exists', title)){ 
     $('#tt').tabs('select', title); 
    } else { 
     var content = '<iframe scrolling="auto" frameborder="0" src="'+url+'" style="width:100%;height:100%;"></iframe>'; 
     $('#tt').tabs('add',{ 
      title:title, 
      content:content, 
      closable:true 
     }); 
    } 
} 

$(function(){ 
    $("#closeTab").click(function() { 
      $.post("clear.php",function(data){ 
      window.parent.$('#tt').tabs('close','Create List'); 
      location.reload();  
     }); 
    }); 
}); 

</script> 


</head> 
<body style="background:#7C96A8;"> 

<div id="stylized" class="myform"> 
<form id="addlist" method="post" action="addNext.php" > 
<h1>Create your new subscriber list</h1> 
<p>Create a new list before adding subscriber <label class="right"><span class="label label-warning"><em class="dot">*</em> Indicates required</span></p> 

<label><em class="dot">*</em> <strong>List name:</strong> 
<span class="small">Add your list name</span> 
</label> 
<input id="lname" name="lname" class="required" <?if (isset($_SESSION['lname'])) { echo "value=".$_SESSION['lname'];}?> /> 

<div class="spacer"></div> 

<label><strong>Reminder:</strong> 
<span class="small">Remind the details of your list</span> 
</label> 
<textarea id="creminder" style="width:300px" name="creminder" cols="15" rows="10"><?if (isset($_SESSION['creminder'])) {echo $_SESSION['creminder'];}?></textarea> 

<div class="spacer"></div> 

<p>Email me when ...</p> 
<label>People subscribe:</label> <input type="checkbox" class="checkbox" name="subscribe" value="1" <? if (isset($_SESSION['subscribe']) && $_SESSION['subscribe']==1){echo "checked='yes'";}?> > 
<label>People unsubscribe:</label> <input type="checkbox" class="checkbox" name="unsubscribe" value="1" <? if (isset($_SESSION['unsubscribe']) && $_SESSION['unsubscribe']==1){echo "checked='yes'";}?> > 


<div class="spacer"></div> 
<input type="button" id="closeTab" value="Cancel" class="btn" style="width:100px"/> 
<input type="submit" value="Next" class="btn btn-primary" style="width:100px"/> 

<div class="spacer"></div> 
</form> 
<div class="spacer"></div> 
</div> 



<br><br><br> 
<div id="stylized" class="myform"> 

<? 
// list out the pervious create list 
try{ 
$sql = ' 
    SELECT * 
    FROM  list,user_list 
    WHERE user_list.UserID=? 
    AND list.ListID=user_list.ListID 
'; 
$stmt = $conn->prepare($sql); 
$stmt->execute(array($_SESSION['username'])); 
$result= $stmt->fetchAll(); 
$numRows= $stmt->rowCount(); 
} 
catch(PDOException $e) 
    { 
    die ($e->getMessage().'<a href="add.php"> Back</a>'); 
    } 


if ($numRows == 0) { 
    echo '<div style="text-align:center;font-weight:bold;">You have not created any list yet.</div>';} 
else { 
    echo '<h1>Your Subscriber List</h1> <p>You have created '.$numRows.' list(s).</p>'; 
foreach ($result as $set) 
{ 
    try{ 
$sql = ' 
    SELECT ls.SubID 
    FROM  list_sub ls,user_list ul 
    WHERE ul.UserID=? 
    AND ls.ListID='.$set['ListID'].' 
    AND ls.ListID=ul.ListID 
'; 
$stmt = $conn->prepare($sql); 
$stmt->execute(array($_SESSION['username'])); 
$numSubs= $stmt->rowCount(); 
} 
catch(PDOException $e) 
    { 
    die ($e->getMessage().'<a href="add.php"> Back</a>'); 
    } 

echo '<span class="label">List Name</span> : <strong>'.$set['ListName'].'</strong><br><br>'; 
echo '<span class="label">Number of subscriber</span> : <strong>'.$numSubs.'</strong><br><br>'; 
echo '<span class="label">Create Date</span> : <strong>'.$set['CreateDate'].'</strong><br><br>'; 
?><a href='#' onclick="addTab('Manage List','list/view.php')" class='btn'>Manage List</a><? 
echo '<p></p>'; 
}} 
    ?> 
<div class="spacer"></div> 
</div> 


<br><br><br> 
<div id="stylized" class="myform"> 

<? 
// list out the public list 
try{ 
$query = ' 
    SELECT * 
    FROM  list 
    Where IsPublic=1 
'; 
$stmt = $conn->prepare($query); 
$stmt->execute(); 
$result= $stmt->fetchAll(); 
$num_rows= $stmt->rowCount(); 
} 
catch(PDOException $e) 
    { 
    die ($e->getMessage().'<a href="add.php"> Back</a>'); 
    } 
$conn = null; 
if ($num_rows == 0) { 
    echo '<div style="text-align:center;font-weight:bold;">There are no public list.</div>';} 
else { 
    echo '<h1>Public Subscriber List</h1> <p>There are '.$num_rows.' list(s).</p>'; 
foreach ($result as $set) 
{ 
    try{ 
$sql = ' 
    SELECT ls.SubID 
    FROM  list_sub ls,user_list ul 
    WHERE ul.UserID=? 
    AND ls.ListID='.$set['ListID'].' 
    AND ls.ListID=ul.ListID 
'; 
$stmt = $conn->prepare($sql); 
$stmt->execute(array($_SESSION['username'])); 
$numSubs= $stmt->rowCount(); 
} 
catch(PDOException $e) 
    { 
    die ($e->getMessage().'<a href="add.php"> Back</a>'); 
    } 

echo '<span class="label">List Name</span> : <strong>'.$set['ListName'].'</strong><br><br>'; 
echo '<span class="label">Number of subscriber</span> : <strong>'.$numSubs.'</strong><br><br>'; 
echo '<span class="label">Create Date</span> : <strong>'.$set['CreateDate'].'</strong><br><br>'; 
echo "<a href='#' onclick='addTab('Manage List','list/view.php')' class='btn'>Manage List</a>"; // **********************the add tag link is here***************************// 
echo '<p></p>'; 

}} 
    ?> 
<div class="spacer"></div> 
</div> 


</div> 
</body> 
</html>

Aktualisiert:

Immer noch keine Antwort, nachdem ich den Code hinzufügen?

<style type="text/css"> 
     @import "../plugin/easyui/themes/default/easyui.css"; 
     @import "../plugin/easyui/themes/icon.css"; 
     @import "../plugin/bootstrap/css/bootstrap.css"; 
     @import "../plugin/bootstrap/css/bootstrap-responsive.css"; 
     @import "../style/form.css"; 
</style> 
<script src="../plugin/jquery-1.6.1.min.js"></script> 
<script type="text/javascript" src="../plugin/easyui/jquery.easyui.min.js"></script> 
<script src="../plugin/jquery.validate.min.js"></script> 

<script> 
$(document).ready(function(){ 
$("#addlist").validate(); 
}); 

$(function(){ 
    $("#closeTab").click(function() { 
      $.post("clear.php",function(data){ 
      window.parent.$('#tt').tabs('close','Create List'); 
      location.reload();  
     }); 
    }); 
}); 



function addTab(title, url){ 
    if ($('#tt').tabs('exists', title)){ 
     $('#tt').tabs('select', title); 
    } else { 
     var content = '<iframe scrolling="auto" frameborder="0" src="'+url+'" style="width:100%;height:100%;"></iframe>'; 
     $('#tt').tabs('add',{ 
      title:title, 
      content:content, 
      closable:true, 
      tools:[{ 
        iconCls:'icon-mini-refresh', 
        handler:function(){ 
       var tab = $('#tt').tabs('getSelected'); 
      $('#tt').tabs('update', { 
       tab: tab, 
       options:{ 
        title:title, 
        content:content, 
        closable:true 
       } 
      }); 
     }      

       }] 
     }); 
    } 
}  

     function init() { 
      $("#addtab1").on("click",function() { 
       addTab("slashdot","http://www.slashdot.org/"); 
      }); 
      $("#addtab2").on("click",function() { 
       addTab("slashdot","http://www.slashdot.org/"); 
      }); 
     } 
     $(init); 


</script> 


</head> 
<body style="background:#7C96A8;padding:10px;"> 

<div id="stylized" class="myform"> 
<form id="addlist" method="post" action="addNext.php" > 
<h1>Create your new subscriber list</h1> 
<p>Create a new list before adding subscriber <label class="right"><span class="label label-warning"><em class="dot">*</em> Indicates required</span></p> 

<label><em class="dot">*</em> <strong>List name:</strong> 
<span class="small">Add your list name</span> 
</label> 
<input id="lname" name="lname" class="required" <?if (isset($_SESSION['lname'])) { echo "value=".$_SESSION['lname'];}?> /> 

<div class="spacer"></div> 

<label><strong>Reminder:</strong> 
<span class="small">Remind the details of your list</span> 
</label> 
<textarea id="creminder" style="width:300px" name="creminder" cols="15" rows="10"><?if (isset($_SESSION['creminder'])) {echo $_SESSION['creminder'];}?></textarea> 

<div class="spacer"></div> 

<p>Email me when ...</p> 
<label>People subscribe:</label> <input type="checkbox" class="checkbox" name="subscribe" value="1" <? if (isset($_SESSION['subscribe']) && $_SESSION['subscribe']==1){echo "checked='yes'";}?> > 
<label>People unsubscribe:</label> <input type="checkbox" class="checkbox" name="unsubscribe" value="1" <? if (isset($_SESSION['unsubscribe']) && $_SESSION['unsubscribe']==1){echo "checked='yes'";}?> > 


<div class="spacer"></div> 
<input type="button" id="closeTab" value="Cancel" class="btn" style="width:100px"/> 
<input type="submit" value="Next" class="btn btn-primary" style="width:100px"/> 

<div class="spacer"></div> 
</form> 
<div class="spacer"></div> 
</div> 


<br><br><br> 
<div id="stylized" class="myform"> 

<? 
// list out the pervious create list 
try{ 
$sql = ' 
    SELECT * 
    FROM  list,user_list 
    WHERE user_list.UserID=? 
    AND list.ListID=user_list.ListID 
'; 
$stmt = $conn->prepare($sql); 
$stmt->execute(array($_SESSION['username'])); 
$result= $stmt->fetchAll(); 
$numRows= $stmt->rowCount(); 
} 
catch(PDOException $e) 
    { 
    die ($e->getMessage().'<a href="add.php"> Back</a>'); 
    } 


if ($numRows == 0) { 
    echo '<div style="text-align:center;font-weight:bold;">You have not created any list yet.</div>';} 
else { 
    echo '<h1>Your Subscriber List</h1> <p>You have created '.$numRows.' list(s).</p>'; 
foreach ($result as $set) 
{ 
    try{ 
$sql = ' 
    SELECT ls.SubID 
    FROM  list_sub ls,user_list ul 
    WHERE ul.UserID=? 
    AND ls.ListID='.$set['ListID'].' 
    AND ls.ListID=ul.ListID 
'; 
$stmt = $conn->prepare($sql); 
$stmt->execute(array($_SESSION['username'])); 
$numSubs= $stmt->rowCount(); 
} 
catch(PDOException $e) 
    { 
    die ($e->getMessage().'<a href="add.php"> Back</a>'); 
    } 

echo '<span class="label">List Name</span> : <strong>'.$set['ListName'].'</strong><br><br>'; 
echo '<span class="label">Number of subscriber</span> : <strong>'.$numSubs.'</strong><br><br>'; 
echo '<span class="label">Create Date</span> : <strong>'.$set['CreateDate'].'</strong><br><br>'; 
?><button id='addtab1' class='btn'>Manage List</button><? 
echo '<p></p>'; 
}} 
    ?> 
<div class="spacer"></div> 
</div> 


<br><br><br> 
<div id="stylized" class="myform"> 

<? 
// list out the public list 
try{ 
$query = ' 
    SELECT * 
    FROM  list 
    Where IsPublic=1 
'; 
$stmt = $conn->prepare($query); 
$stmt->execute(); 
$result= $stmt->fetchAll(); 
$num_rows= $stmt->rowCount(); 
} 
catch(PDOException $e) 
    { 
    die ($e->getMessage().'<a href="add.php"> Back</a>'); 
    } 
$conn = null; 
if ($num_rows == 0) { 
    echo '<div style="text-align:center;font-weight:bold;">There are no public list.</div>';} 
else { 
    echo '<h1>Public Subscriber List</h1> <p>There are '.$num_rows.' list(s).</p>'; 
foreach ($result as $set) 
{ 
    try{ 
$sql = ' 
    SELECT ls.SubID 
    FROM  list_sub ls,user_list ul 
    WHERE ul.UserID=? 
    AND ls.ListID='.$set['ListID'].' 
    AND ls.ListID=ul.ListID 
'; 
$stmt = $conn->prepare($sql); 
$stmt->execute(array($_SESSION['username'])); 
$numSubs= $stmt->rowCount(); 
} 
catch(PDOException $e) 
    { 
    die ($e->getMessage().'<a href="add.php"> Back</a>'); 
    } 

echo '<span class="label">List Name</span> : <strong>'.$set['ListName'].'</strong><br><br>'; 
echo '<span class="label">Number of subscriber</span> : <strong>'.$numSubs.'</strong><br><br>'; 
echo '<span class="label">Create Date</span> : <strong>'.$set['CreateDate'].'</strong><br><br>'; 
echo "<button id='addtab1' class='btn'>Manage List</button>"; 
echo '<p></p>'; 

}} 
    ?> 
<div class="spacer"></div> 
</div> 


</div> 
</body> 
</html>

Quelle

2012-04-03 user782104

Was ist der Code in 'addTab()'? –

Ich habe die Frage aktualisiert, Entschuldigung für ausgelassenen Code, bitte lassen Sie mich wissen, wenn etwas fehlt – user782104

Ich habe die ganze Seite hinzugefügt und kommentieren Sie die Registerkarte Hinzufügen Link – user782104

Ist das was du willst?

$("# tags div id ").tabs({ 
      add: function(event, ui) { 
       $(this).append(ui.panel) 
      } 
    })

Das ist nur pure und einfache Registerkarte hinzufügen, ich denke, das ist, was Sie gefragt haben.

Viel Glück.

Quelle

2012-05-11 22:48:32

Ich habe eine minimale Umsetzung der Ausgabe erstellt Sie here beschreiben, und es funktioniert ohne Probleme. Es verwendet eine weniger modifizierte Version Ihrer addTab()-Funktion.

Ich empfehle Ihnen, die ehrwürdigen Firebug oder die Entwickler-Tools in Chrome zu verwenden, um zu sehen, was Javascript oder andere Fehler auftreten.

Versuchen Sie auch, einfach auf die neuesten jQuery- und jQuery-easui-Bibliotheken zu aktualisieren, und sehen Sie, ob das hilft.

Quelle

2012-04-08 12:25:27

Danke, warum gibt es keine Antwort, nachdem ich auf den Button geklickt habe? – user782104

Uncaught TypeError: Objekt [Objekt Objekt] hat keine Methode 'an'? – user782104

Sie sollten sagen, welchen Browser Sie verwenden. – Alexander

Verwenden von jquery easyui, wie erstellt man einen Tab durch einen Link, der sich in einem Tab befindet?

Antwort

Verwandte Themen