jQuery: выберите флажок при нажатии поля загрузки

Question

Я работаю над CMS. Когда пользователь хочет заменить существующее эскизное изображение, он может загрузить замену и установить флажок, чтобы подтвердить, что они действительно заменяют изображение. Флажок кажется необходимым, потому что в противном случае форма отправляет пустое значение (из-за пустого значения по умолчанию для поля загрузки, по умолчанию для всех браузеров) и вытирает существующее изображение без указания замещающего изображения.

Проблема заключается в том, что я забываю вручную активировать флажок и загруженное изображение фактически не заменит существующий, потому что без флажка проверяется файл Принимающий PHP не (дизайн) обработки загружаемых файлов , Я подозреваю, что у пользователей будет такая же проблема, и я хочу, чтобы это не произошло, уменьшив количество необходимых шагов. Одним из решений было бы проверить флажок с jQuery всякий раз, когда нажимается поле загрузки. Так почему же не эта работы:

$('#image_req').click(function() { 
    if ($('#checkbox_req').attr('checked',true)) { 
     $('#checkbox_req').removeAttr('checked'); 
     alert('Unchecked'); 
    } else if ($('#checkbox_req').attr('checked',false)) { 
     $('#checkbox_req').attr('checked','checked'); 
     alert('Checked'); 
    } 
}); 

HTML, в вопросе выглядит следующим образом:

<input id="image_req" name="local_filename" type="file" /> 
<input id="checkbox_req" name="replace_image" value="yes" type="checkbox" /> 

Answer 1

это может быть, что $ конфликтуют с существующей библиотекой JavaScript в вашем CMS. Я должен был сделать что-то подобное с некоторыми коробками и узнал о jQuery.noConflict:

jQuery.noConflict(); 

jQuery(document).ready(function() { 
    //preselect sectionid 
    jQuery('select[name="sectionid"] option[value="29"]').attr("selected", true); 
    jQuery('select[name="sectionid"] option[value="29"]').trigger("change"); 
    jQuery('select[name="access"] option[value="1"]').attr("selected", true); 
}); 

после «jQuery.noConflict();» Вы можете использовать «JQuery» вместо «$»

также в моем случае я должен был вызвать событие изменения, поскольку содержание в переключателе «Доступ» находится в зависимости от любой выбран в «sectionid» переключателе

Answer 2

Can» t вы включаете значение по умолчанию в скрытый ввод (type="hidden")? Таким образом, когда вы отправляете форму, вы знаете, что такое значение по умолчанию. Если ничего не меняется, используйте значение по умолчанию или ничего не делайте, и если файл загружается (отметьте $_FILES), используйте новый файл.

Answer 3

@Arne

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

$('#image_req').mouseup(function() { 
    if ($('#checkbox_req').attr('checked',false)) { 
     $("input[name='replace_image']").attr('checked', true); 
    } 
}); 

@Doug: спасибо за совет

Answer 4

Ваш, если условия не работают должным образом, потому что вы на самом деле assigning ценности вместо того, чтобы получить их. Попробуйте это:

$('#image_req').click(function() { 
    var checkbox = $('#checkbox_req'); 
    if (checkbox.is(':checked')) { 
     checkbox.removeAttr('checked'); 
     alert('Unchecked'); 
    } else { 
     checkbox.attr('checked', 'checked'); 
     alert('Checked'); 
    } 
}); 

Но это делает какой-то смысл? Когда пользователь сначала проверяет флажок вручную, а затем удаляет загрузку, он снова не проверяется.

Я бы пометил его по умолчанию, установив в свой HTML-код checked. Если пользователь не захочет заменить изображение, он может снять его вручную.

PS: Как просто повернуть флажок в скрытое поле, если вам действительно нужен этот флажок, который нужно всегда проверять?

<input id="checkbox_req" name="replace_image" value="yes" type="hidden" /> 

Если это не представляется возможным по какой-либо причине, вот еще одна идея, с тем же эффектом: Установите флажок с яваскрипт и скрыть его с помощью CSS.

Answer 5

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