Bootstrap typeahead在jquery文件上传插件中不起作用

时间:2012-11-13 16:14:24

标签: jquery-plugins file-upload twitter-bootstrap bootstrap-typeahead

我正在使用jQuery文件上传插件,并在表单中尝试使用来自twitter bootstrap的typeahead,但它不起作用,

代码是这样的:

<!-- The template to display files available for upload -->
<script id="template-upload" type="text/x-tmpl">
{% for (var i=0, file; file=o.files[i]; i++) { %}
    <tr class="template-upload fade">
        <td class="preview"><span class="fade"></span></td>
        <td class="name">
        <input type="text" name="uploader-title[]" value="" placeholder="{%=file.name%}">
        </td>
        <td class="size"><span>{%=o.formatFileSize(file.size)%}</span></td>
        {% if (file.error) { %}
        <td class="error" colspan="2"><span class="label label-important">{%=locale.fileupload.error%}</span> {%=locale.fileupload.errors[file.error] || file.error%}</td>
        {% } else if (o.files.valid && !i) { %}
        <td>
            <div class="progress progress-success progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0"><div class="bar" style="width:0%;"></div></div>
        </td>
        <td class="start">{% if (!o.options.autoUpload) { %}
            <button class="btn btn-primary">
                <i class="icon-upload icon-white"></i>
                <span>{%=locale.fileupload.start%}</span>
            </button>
        {% } %}</td>
        {% } else { %}
        <td colspan="2"></td>
        {% } %}
        <td class="cancel">{% if (!i) { %}
            <button class="btn btn-warning">
                <i class="icon-ban-circle icon-white"></i>
                <span>{%=locale.fileupload.cancel%}</span>
            </button>
        {% } %}</td>

    </tr>

    <tr>
        <td> </td>
        <td>
            <select name="uploader-subsector[]" onchange="uploaderSelectSubsector(this)" required>
            <option value="">Subsectores</option>
            </select>
        </td>

        <td>
            <select name="uploader-eje[]" onchange="uploaderSelectEje(this)" required>
                <option value="">Ejes</option>
            </select>
        </td>

        <td>
            <select name="uploader-ae[]" onchange="uploaderSelectAe(this)" required>
                <option value="">Contenidos</option> 
            </select>
        </td>
    </tr>
    <tr>
     <td> </td>
        <td>
            <input name="uploader-description[]" type="text" placeholder="Descripción (Ej: Prueba de ecuaciones)"/>
        </td>

        <td >
            <input name="uploader-tags[]" id="uploader-tags" type="text" placeholder="Tags (Ej: ecuaciones, logaritmos)" data-provide="typeahead"/>
        </td>

        <td>
            <select name="uploader-nivel[]" onchange="uploaderSelectNivel(this)">
                <option value="">Nivel</option>
            </select>
        </td>
    </tr>

{% } %}
</script>

然后在javascript中使用

调用列表
<script type="text/javascript">
        jQuery(document).ready(function() {
        var helps = ['hola','mundo'];
        $('#uploader-tags').typeahead({source: helps, items:5});
    });
</script>

如果我将控件置于

之外,我正在加载javascripts
<script id="template-upload" type="text/x-tmpl">
</script>

标签它工作正常,但在我内部无法使其工作,希望你可以帮助我这个

0 个答案:

没有答案