2012-04-03 2 views
5

Tabs documentjquery easyui를 사용하여 탭에있는 링크로 탭을 만드는 방법은 무엇입니까?

나는 새 탭을 만들고 싶습니다

탭 에있는 링크에서있다. 예를 들어

는, 탭 A의 "열려있는 탭 B"링크가 있으며,이 탭 (B)을 추가해야합니다,

나는 인 (링크 탭에없는 경우 해당 탭을 만드는 방법을 시도

그러나이 경우 내가 누를 때 응답이 없습니다. 감사합니다

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

addtab 기능

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

전체 페이지

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

업데이트 :

아직도 응답 내가 코드를 추가하지 후?

<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

'addTab()'의 코드는 무엇입니까? –

+0

질문이 누락되었습니다. 누락 된 코드가 있으면 죄송합니다. 누락 된 항목이 있으면 알려주십시오. – user782104

+1

전체 탭을 추가하고 탭 추가 링크에 대한 의견을 말하십시오. – user782104

답변

1

이게 원하는가요?

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

그건 그냥 순수하고 간단한 탭 추가, 나는 당신이 요청한 것 같아요.

행운을 빈다.

0

난 당신이 here을 설명하는 문제에 대한 최소한의 구현을 만들었습니다, 그것은 어떤 문제없이 작동합니다. 그것은 addTab() 함수의 menially 수정 된 버전을 사용합니다.

당신은 자바 스크립트 또는 다른 오류가 발생하는지 확인하기 위해 훌륭한 Firebug 또는 Chrome에 내장 된 개발자 도구를 사용하는 것이 좋습니다.

또한 최신 jQuery 및 jQuery-easui 라이브러리로 업그레이드하면 도움이되는지 확인하십시오.

+0

버튼을 클릭 한 후 응답이없는 이유는 무엇입니까? – user782104

+1

잡히지 않은 TypeError : Object [object Object]에 'on'메서드가 없습니다? – user782104

+0

사용중인 브라우저를 말해야합니다. – Alexander

관련 문제