html - Bootstrap Tour with an ASP.NET/MVC layout page -


i'm trying set bootstrap tour. i've got 2 pages (design.vbhtml , edithomepage.vbhtml). both use layout page called (_designerlayout.vbhtml). i've got scripts , stylesheets bootstrap, tour, jquery, etc. listed on layout page. stuff correct.

my tour starts on design page , displays first 3 steps correctly. when gets fourth step (called third-step, not confused), goes second page doesn't continue steps. tour stops.

my elements id's on div tags (welcome-step, first-step, etc.). know correct. has paths.

i've looked everywhere , can't seem find else using layout page tour, i'm wondering if has steps jumping design page layout page edithomepage page. ideas appreciated!

here bootstrap tour code---

design.vbhtml (first page):

$(function () {     // instance tour     var tour = new tour({         backdrop: true,         steps: [         {             element: "#welcome-step",             title: "welcome!",             content: "begin tour see how can design of website.",             orphan: true,             path: "/clubathleticstemplate/organization/design/" & "@viewbag.organizationid"             // element on design.vbhtml page         },         {             element: "#first-step",             title: "change look",             content: "use section design how website looks. can choose pages want include on website.",             path: "/clubathleticstemplate/organization/design/" & "@viewbag.organizationid"             // element on design.vbhtml page         },         {             element: "#second-step",             title: "edit pages",             content: "these different pages can edit website. click on each 1 customize.",             path: "/clubathleticstemplate/organization/design/" & "@viewbag.organizationid"             // element on _designerlayout.vbhtml page         },         {             element: "#third-step",             title: "main photo",             content: "you can upload main photo appear on front page.",             path: "/clubathleticstemplate/organization/edithomepage/" & "@viewbag.organizationid"             // element on edithomepage.vbhtml page         },         {              element: "#fourth-step",             title: "main photo display",             content: "you can specify whether or not want main photo show @ top of of pages.",             path: "/clubathleticstemplate/organization/edithomepage/" & "@viewbag.organizationid"             // element on edithomepage.vbhtml page         },         {             element: "#fifth-step",             title: "page headline",             content: "this can set title page.",             path: "/clubathleticstemplate/organization/edithomepage/" & "@viewbag.organizationid"             // element on edithomepage.vbhtml page         },         {             element: "#sixth-step",             title: "page content",             content: "here add content page. can add text, images, media, tables, etc.",             path: "/clubathleticstemplate/organization/edithomepage/" & "@viewbag.organizationid"             // element on edithomepage.vbhtml page         },         {             element: "#seventh-step",             title: "save changes",             content: "make sure hit 'save' button when finished!",             path: "/clubathleticstemplate/organization/edithomepage/" & "@viewbag.organizationid"             // element on edithomepage.vbhtml page         }         ]     });      // initialize tour     tour.init();      // start tour     tour.start(); }); ; 

i discovered copying , pasting entire tour onto second page gets work perfectly. it's not best coding practice seeing have same code in 2 different places , have change both locations each time make change in it. but, now, works.


Comments