2012-04-03 25 views
5

Tabs documentUtilizzando jquery easyui, come creare una scheda con un collegamento che si trova in una scheda?

vorrei creare una nuova scheda, che dal link che si trova in una scheda .

per esempio, in scheda una, c'è un link "scheda aperta b", e dovrebbe aggiungere una scheda b,

ho cercato il modo di creare scheda che quando il collegamento non è in scheda (che è funzionante)

tuttavia, in questo caso quando lo preme, non ha risposta. Grazie

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

addtab funzione

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 
     }); 
    } 
} 

pagina intera

<? 
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> 

Aggiornato:

Ancora nessuna risposta dopo aggiungo il codice?

<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> 
+1

Qual è il codice in 'addTab()'? –

+0

Ho aggiornato la domanda, mi dispiace per il codice omesso, per favore fatemi sapere se manca qualcosa – user782104

+1

Ho aggiunto la pagina intera e commentate il collegamento Aggiungi scheda – user782104

risposta

1

È questo quello che vuoi?

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

Questa è solo una semplice e semplice scheda aggiunta, penso che sia quello che hai chiesto.

Buona fortuna.

0

ho creato un'implementazione minima del problema si sta descrivendo here, e funziona senza problemi. Utilizza una versione modificata menzionalmente della tua funzione addTab().

Ti suggerisco di utilizzare il venerabile Firebug o gli strumenti di sviluppo incorporati in Chrome, per vedere quali errori javascript o di altro tipo si verificano.

Inoltre, provare semplicemente l'aggiornamento alle librerie jQuery e jQuery-easui più recenti, e vedere se questo aiuta.

+0

Grazie perché non c'è risposta dopo aver fatto clic sul pulsante? – user782104

+1

Unchaught TypeError: Object [oggetto Object] non ha alcun metodo 'on'? – user782104

+0

Dovresti dire quale browser stai usando. – Alexander

Problemi correlati