2016-06-03 13 views
1

Sieht so aus, als ob es schon viele Diskussionen darüber gegeben hat, aber ich kann meinen Code einfach nicht funktionieren lassen.Verknüpfen von Bootstrap-Registerkarten mit Server-URLs

Ich habe ein Django-Projekt und Vorlagen mit Bootstrap Tab Pillen. Ich versuche Tab-Menü-Pillen an die URLs meines Django-Projekts zu binden. Und ich kann nicht von Uncaught Error: Syntax error, unrecognized expression: /employee_user_info/40/ Fehler auf der Clientseite gelesen werden. Hier ist mein Code:

HTML:

<div class="container"> 
     <h2>{{person_details_form.second_nm_rus.value}} {{person_details_form.first_nm_rus.value}} {{person_details_form.middle_nm_rus.value}}</h2> 
     <ul class="nav nav-pills"> 
      <li class="active"><a data-toggle="pill" href="#home">Tab 1</a></li> 
      <li><a data-toggle="pill" href='/employee_user_info/{{employee_unique_id}}/'>Tab 2</a></li> 
      <li><a data-toggle="pill" href="#menu2">Tab 3</a></li> 
     </ul> 

     <div class="tab-content" style="margin-top:2%"> 
      <div id="home" class="tab-pane fade in active"> 
       <div class="container"> 
        <!-- Something --> 
       </div> 
      </div> 
     </div> 

Django URLconf

url(r'^employee_user_info/(?P<employee_unique_id>\d+)/$',employee_views.profile_user_info, name ='employee_user_info'), 

JS

var navpills = $('.nav-pills'); 
$(function() { 
    // activate tab on click 
    navpills.on('click', 'a', function (e) { 
     var $this = $(this); 
     // prevent the Default behavior 
     e.preventDefault(); 
     // send the hash to the address bar 
     window.location.hash = $this.attr('href'); 
     // activate the clicked tab 
     $this.tab('show'); // The error arises here 
    }); 

    $(window).bind('hashchange', refreshHash); 

    // read has from address bar and show it 
    if(window.location.hash) { 
     // show tab on load 
     refreshHash(); 
    } 
}); 
function refreshHash() { 
     navpills.find('a[href="'+window.location.hash+'"]').tab('show'); 
    } 

UPDATE:

Die er ror geschieht auf der Client-Seite, wenn ich auf Tab 2.

UPDATE 2

Wenn Tab 2 drücken, die URL wird http://127.0.0.1:8000/employee_profile_main/40/#/employee_user_info/40/ Ich denke, der Dollar stoppt hier

+0

Sie müssen mehr Kontext geben. Wo genau passiert dieser Fehler? –

+0

Nein, bitte geben Sie den Kontext des Fehlers an, der vom Browser gemeldet wurde. Auf welcher Linie passiert es? –

+0

Ich habe einen Kommentar neben der Zeile –

Antwort

0

Sie können‘ t set href für a mit /. Ich vermute, dass es als Selektor verwendet wurde.

+0

hinzugefügt Ich habe versucht, href = 'employee_user_info/{{mitarbeiter_unique_id}} /' und href = '/ mitarbeiter_benutzer_info/{{mitarbeiter_unique_id}} /' und sogar href = '# mitarbeiter_benutzer_info/{{mitarbeiter_unique_id }}/':) –

+1

@EdgarNavasardyan, я написал, что вы не можете использовать '/' в href, т.к. в bootstrip используется в качестве селектора. (Sie können nicht '/' in 'href' verwenden. Bootstrap verwenden href als Selektor) – betonimig

+0

Приятно) впервые пишу здесь по-русски. Не могли бы уточнить, просто новичёк в этом. Можете написать сам код? –