2012-06-22 5 views
2

Я использую загрузчик файлов valums. Но я хочу запустить флажок, чтобы отключить кнопку загрузки, если пользователь не проверил ее.Если флажок снят флажок отключить кнопку загрузки

Я могу заставить его работать в обычной форме, но не использовать валумы, потому что я думаю, что он использует элементы div как атрибуты формы. Поэтому я предполагаю, что я напортачил код.

В HTML у меня есть:

<form class="well"> 
<label>Upload a Single File</label> 
<label class="checkbox"> 
<input id="tos" onclick="if(this.checked){this.form.qq-upload-button.disabled=false}else{this.form.qq-upload-button.disabled=true};this.blur();" checked="" value="1" name="tos" type="checkbox"> I have read and agree to the <a href="/tos">TOS</a> 
</label> 
<div id="file-uploader-demo1">  
    <noscript>   
     <p>Please enable JavaScript to use file uploader.</p> 
     <!-- or put a simple form for upload here --> 
    </noscript>   
</div> 
</form> 

В fileuploader.js (valums код у меня есть)

template: '<div class="qq-uploader">' + 
      '<div class="qq-upload-drop-area"><span>Drop files here to upload</span></div>' + 
      '<div class="qq-upload-button btn btn-primary left">Upload a file</div><span class="help-inline">&nbsp;Lets Do it!</span>' + 
      '<ul class="qq-upload-list"></ul>' + 
      '</div>', 

Можете ли вы определить, что я наклонил вверх?

По сути, я хочу отключить кнопку загрузки, если пользователь не установил флажок.

Для правильной формы, этот код работает:

<form class="well"> 
    <label>Upload a Single File</label> 
    <input type="file" class="span3" placeholder="Click Here"> 
    <span class="help-inline">Associated help text!</span> 
    <label class="checkbox"> 
    <input id="tos" onclick="if(this.checked){this.form.btn.disabled=false}else{this.form.btn.disabled=true};this.blur();" checked="" value="1" name="tos" type="checkbox"> I have read and agree to the <a href="/tos">TOS</a> 
    </label> 
    <input name="btn" type="submit" class="btn btn-primary left" value="UPLOAD"> 
</form> 

ответ

4

Удалить обработчик рядный onclick и добавьте следующий код JavaScript:

$('#tos').on('change', function() { 
    $('.qq-upload-button').prop('disabled', !this.checked); 
}); 

Это синхронизирует «инвалид» состояние с отрицаемого ' checked "состояния флажка.

Причина, по которой ваш исходный код не работал, заключается в том, что this.form.qq-upload-button недействителен JavaScript. Вместо этого вам придется использовать this.form['qq-upload-button']. Однако, используя приведенный выше код, много очиститель.

+0

Thankyou @ThiefMaster, так что я избавлюсь от кода внутри ? – 422

+0

+1 Nice. Но '.on()' действительно нужен? Невозможно использовать '.change()'? – iambriansreed

+0

@ 422 Просто удалите атрибут onchange. – iambriansreed

Смежные вопросы