javascript - Unable to load tabbed pages with data -


i have task have tab 3 different html pages under 3 tabs. these pages load grids data user navigates them. able tab html pages.there working plunkr of that. http://plnkr.co/edit/0xgquovkiicmggcsvsef?p=preview problem cant load pages data earlier. have possibly gone wrong? these tabbed pages dont load grids data. html

<style>     ul {         list-style: none;         padding: 0;         margin: 0;     }      li {         float: left;         border: 1px solid #000;         border-bottom-width: 0;         margin: 3px 3px 0px 3px;         padding: 5px 5px 0px 5px;         background-color: none;         color: none;     } </style> <!doctype html> <html xmlns="http://www.w3.org/1999/xhtml"> <head>     <title></title> </head>  <body>     <div id="tabs">         <ul>             <li ng-repeat="tab in tabs"                 ng-class="{active:isactivetab(tab.url)}"                 ng-click="onclicktab(tab)">{{tab.title}}</li>         </ul>         <div id="mainview">             <div ng-include="currenttab"></div>         </div>     </div> </body> </html>

controller code :

b360myutilities.controller("tabscontroller",     [     "$scope",     function ($scope) {          $scope.tabs = [{             title: 'plansetupstatus',             controller: "plansetupstatuscontroller",             templateurl: "app/templates/views/utilities/plansetupstatus.html"          }, {             title: 'migrationscheduled',             controller: "migrationscheduledcontroller",             templateurl: "app/templates/views/utilities/migrationhistory.html"         }, {             title: 'migrationhistory',             controller: "migrationhistorycontroller",             templateurl: "app/templates/views/utilities/migrationscheduled.html"         }];          $scope.currenttab =  "app/templates/views/utilities/plansetupstatus.html"          $scope.onclicktab = function (tab) {             $scope.currenttab = tab.templateurl;         }          $scope.isactivetab = function (taburl) {             return taburl == $scope.currenttab;         }     }]);

i added comment, ill explain here in further details. plunker gave shows simple template change controller stay parent controller or base. on other hand want add unique data , render different page.

so if you're using ui-router solution simple... define 3 routes tabs , use like:

<ul class="nav nav-tabs" role="tablist">         <li ng-class="{active: 'passagetab' === currtab}" ng-if="isreadingcomprehension || showsatpassage()">             <a ui-sref=".editkeywordparametersbase.editquestionpassage({questiontype: questiontype})" ng-click="movetotab('passagetab')">              {{ltglabels.passage_label}}             </a>         </li>         <li ng-class="{active: 'sprquestionediting' === currtab}" ng-if="isspr">             <a ui-sref=".editsprquestion" ng-click="movetotab('sprquestionediting')">              {{ltglabels.main_spr_question}}             </a>         </li>         <li ng-class="{active: 'numericentryquestionediting' === currtab}" ng-if="isnumericentry">             <a ui-sref=".editnumericentryquestion" ng-click="movetotab('numericentryquestionediting')">               {{ltglabels.numeric_entry_title}}            </a>         </li>         <li ng-class="{active: 'questionediting' === currtab}" ng-if="ismultiplechoice">             <a ui-sref=".editquestion" ng-click="movetotab('questionediting')">              {{ltglabels.main_question_tab_label}}             </a>         </li>         <li ng-class="{active: 'keyword' === currtab}">             <a ui-sref=".editkeywordparametersbase.editquestionkeywords({questiontype: questiontype})" ng-click="movetotab('keyword');">               {{ltglabels.keywords_title}}             </a>         </li>         <li ng-class="{active: 'questionparams' === currtab}">             <a ui-sref=".editquestionparameters({questiontype: questiontype})" ng-click="movetotab('questionparams')">               {{ltglabels.question_parameters_title}}             </a>         </li>         <li ng-class="{active: 'versionhistory' === currtab}">             <a ui-sref=".versionhistory({questiontype: questiontype})" ng-click="movetotab('versionhistory')">               {{ltglabels.version_history}}             </a>         </li>     </ul>

if dont want that... can inject controller template (i dont solution should work). like:

<script type="text/ng-template" class="template" id="addlegtemplate"> <div ng-controller='mycontroller'> <!--html adding new leg--> </div>

and if dont of have data in controller holds tabs auto connected scope.


Comments

Post a Comment

Popular posts from this blog

javascript - Google App Script ContentService downloadAsFile not working -

i have web app developed using google app script htmlservice , html form, populating excel sheet in google drive using spreadsheetapp . , 1 section calling contentservice download data excel file. function doget(e) { // read excel sheet //getappfile(); // render application html template return htmlservice.createtemplatefromfile('index').evaluate() .settitle('go smart') .setsandboxmode(htmlservice.sandboxmode.iframe); } function downloaddoublequatecsvfile() { var sheetid = propertiesservice.getscriptproperties().getproperty('sheetid'); var ss = spreadsheetapp.openbyid(sheetid).getactivesheet(); //var ss = spreadsheetapp.getactivespreadsheet().getactivesheet(); var maxcolumn = ss.getlastcolumn(); var maxrow = ss.getlastrow(); var data = ss.getrange(1, 1, maxrow, maxcolumn).getvalues(); if (data.length > 1) { var csv = ""; (var row = 0; row < data.length; row++) { (var c...
Read more

javascript - Function overwritting -

is there way overwrite function or event handling in function? using addeventlistener, can have many event handlers on element want var test=document.getelementbyid("div"); test.addeventlistener("click",function(){alert("im first");},false); test.addeventlistener("click",function(){alert("im second");},false); // alerts "im first" , after "im second" but if want overwrite function/event example based on client width example this function one() { alert("first"); } function two() { alert("second"); } window.onresize = function() { var test = document.getelementbyid("div"); if (window.innerwidth > 500) { test.onclick = 1 } else { test.onclick = two; } } is possible in javascript? in case use effective little known approach. addeventlistener can accept object property handleevent event handler. in case it's easy overwr...
Read more

php - Find a regex to take part of Email -

i have following emails need extract part from: bestellnummer xxx: 1 von xxx, 1er pack ------------- anfang der nachricht ------------- foo bar baz foo bar baz // <<<<< need text here ------------- ende der nachricht ------------- ------------- anfang der nachricht ------------- foo bar baz foo bar baz ------------- ende der nachricht ------------- there 0 unlimited occurences of ------------- anfang der nachricht ------------- ------------- ende der nachricht ------------- and i'm able extract first part regex: $re = "/------------- .*? -------------.?(.*?).?------------- .*? -------------/s"; but, i'm quite new on learning regex, i'm pretty sure there must better regex extract part (foo bar baz foo bar baz) of text between ------------- anfang der nachricht ------------- ------------- ende der nachricht ------------- as can in different languages, i'm using .? to match between hyphens. i...
Read more