Cos'è x-tmpl?

86

Stavo cercando la risposta in rete, ma non ho trovato nulla. Questo piccolo spuntino di codice mi frustra davvero, perché non riesco a capirlo. (Fa parte del plugin chiamato: jQuery File Upload)

<script id="template-download" type="text/x-tmpl">
{% for (var i=0, file; file=o.files[i]; i++) { %}
  <tr class="template-download fade">
    {% if (file.error) { %}
        <td></td>
        <td class="name"><span>{%=file.name%}</span></td>
        <td class="size"><span>{%=o.formatFileSize(file.size)%}</span></td>
        <td class="error" colspan="2"><span class="label label-important">{%=locale.fileupload.error%}</span> {%=locale.fileupload.errors[file.error] || file.error%}</td>
    {% } else { %}
        <td class="preview">{% if (file.thumbnail_url) { %}
            <a href="{%=file.url%}" title="{%=file.name%}" rel="gallery" download="{%=file.name%}"><img src="{%=file.thumbnail_url%}"></a>
        {% } %}</td>
        <td class="name">
            <a href="{%=file.url%}" title="{%=file.name%}" rel="{%=file.thumbnail_url&&'gallery'%}" download="{%=file.name%}">{%=file.name%}</a>
        </td>
        <td class="size"><span>{%=o.formatFileSize(file.size)%}</span></td>
        <td colspan="2"></td>
    {% } %}
    <td class="delete">
        <button class="btn btn-danger" data-type="{%=file.delete_type%}" data-url="{%=file.delete_url%}">
            <i class="icon-trash icon-white"></i>
            <span>{%=locale.fileupload.destroy%}</span>
        </button>
        <input type="checkbox" name="delete" value="1">
    </td>
  </tr>
{% } %}
</script>

Allora, che tipo è text/x-tmpl?
Cosa sono questi {%e i %}tag?
Quale parser esegue questo codice?
...

... ma vorrei sapere tutto su questo.

html

— Dyin
fonte

hey mi diresti come hai inviato i dati con il caricamento come se volessi inviare il luogo con il file

— NullPoiиteя

@ Mayankswami: non capisco cosa stai cercando di chiedere da me.

— Dyin

Penso che tu abbia utilizzato il caricamento del file jquery da allora. voglio sapere come inviare i dati del modulo con il file.

— NullPoiиteя

@ Mayankswami: Penso che dovresti cercare la tua domanda su questo sito e, se non trovi quello che stai cercando, crea una domanda.

— Dyin

questo stesso codice che ho visto nell'uploader di file jquery, quindi ti

— ho chiesto

63

x-tmpl non ha alcun significato reale, semplicemente impedisce al browser di interpretare lo script come javascript.

Viene utilizzato principalmente con i modelli jquery o l' associazione di modelli knockoutjs .

Ad un certo punto, un oggetto dati javascript verrà utilizzato insieme al modello per eseguire il rendering di alcuni html. I valori nell'oggetto dati sostituiranno quelli contrassegnati con {%} e simili nel modello, con alcune sezioni {%} che riflettono il flusso di codice come i loop ecc.

Non sono sicuro di quale libreria di modelli utilizzi {%}, tuttavia, non sono modelli jquery, jsrender o knockout. Dovresti controllare a quali librerie si fa riferimento nel codice di esempio.

— NibblyPig
fonte

25

L'ho trovato qui JavaScript Templates . Lo script è stato referenziato da questo sito. Ora tutto ha un senso. Grazie per la tua birra!

— Dyin

1

jQuery non ha funzionato quando eseguo il rendering HTML con x-tmpl. Ad esempio, ho una casella di controllo che esegue il rendering all'interno di x-tmpl. <label class = "modifiericon btn"> <input type = "checkbox" id = 'seo'> SEO </label>. Lo script aggiunto all'interno del file html. Ad esempio <script type = "text / javascript"> $ ('# seo'). Change (function () {if ($ (this) .is (': checks')) {alert ('hi');} else {alert ('hello');}} </script>

— 502_Geek

11

Allora, che tipo è text / x-tmpl?

Uno non standard. Però sembra un modello.

Cosa sono questi tag {% e%}?

Parte del linguaggio dei modelli.

Quale parser esegue questo codice?

Probabilmente uno scritto in JavaScript e importato in un altro <script>elemento sulla stessa pagina.

— Quentin
fonte

0

jQuery-File-Uploadha una dipendenza da JavaScript-Templatescui utilizza il text/x-tmpltipo MIME non standard

— Shai Coleman
fonte

-4

Il codice sopra fa riferimento al progetto Django Jquery File Upload trovato qui https://github.com/sigurdga/django-jquery-file-upload

I {%%} sono tag modello Django. Per maggiori informazioni visita https://docs.djangoproject.com/en/dev/ref/templates/

Questi tag verranno analizzati dal sistema di template django

— czager
fonte

2

Facendo ulteriori ricerche su questo ho scoperto che la mia risposta era sbagliata. In questo caso i tag sono stati utilizzati da questa libreria Javascript github.com/sigurdga/django-jquery-file-upload/blob/master/… come metodo per visualizzare il contenuto HTML in tempo reale in base al risultato di un'operazione AJAX.

— czager

7

Questi tag non sono tag modello Django, ma tag modello Javascript di Sebastian Tschan: blueimp.github.com/JavaScript-Templates

— Ricardo Carmo