Проверьте, выбраны ли опции выбора

Я запускаю плагин dataTables для проекта.Проверьте, выбраны ли опции выбора

Не могли бы вы показать мне, где я делаю это неправильно (это очень просто и не показывает никаких ошибок):

<select name="DataTables_Table_0_length" aria-controls="DataTables_Table_0" class="form-control input-sm"> 
    <option value="10">10</option> 
    <option value="25">25</option> 
    <option value="50">50</option> 
    <option value="100">100</option> 
</select>

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

Я попробовал следующее (только для значения = "50"):

var selected_result = $('select option:nth(2)'); 
var tfoot = $('tfoot'); 
tfoot.hide(); 

if (selected_result.is(':selected')) { tfoot.show(); }

Спасибо

источник

2014-10-15 dddexxx

пытаются таким образом tfoot.val (50) – Fabio

Используйте .change() затем проверить, если он выбран, чтобы либо показать/скрыть колонтитул.

$(document).ready(function() { 
$("#tfoot").hide(); 
    $("select").change(function() { 
     if ($("select option:nth(2)").is(":selected")) { 
      $("#tfoot").show(); 
     } else { 
      $("#tfoot").hide(); 
     } 
    }); 
});

http://jsfiddle.net/rcLrf18j/

источник

2014-10-15 11:54:46

Спасибо! Работал. Почему вы используете изменения? Я думал, что он может обнаружить только при отборе. – dddexxx

Поскольку вы хотите проверить, выбран ли этот параметр при каждом изменении параметра, либо показать или скрыть '$ (" # tfoot ")', указав, выбран ли параметр или нет. –

Он может обнаруживать при выборе, но вы хотите проверить его после его изменения. :) Надеюсь, что это ясно. –

\t \t function showOptionValue() { 
 
\t \t \t var optionSelected = document.getElementById("select_test"); 
 
\t \t \t var optionSelected_value = optionSelected.options[optionSelected.selectedIndex].value; 
 
\t \t \t 
 
\t \t \t alert(optionSelected_value); 
 
\t \t }

<!DOCTYPE html> 
 
<html> 
 
\t <head> 
 
\t \t <title></title> 
 
\t \t <meta charset="utf-8" /> 
 
\t </head> 
 
\t <body> 
 
\t 
 
\t \t <form action = "" method = "post"> 
 
\t \t \t <select name = "select_test" id = "select_test" > 
 
\t \t \t \t <option value = "10">10</option> 
 
\t \t \t \t <option value = "25">25</option> 
 
\t \t \t \t <option value = "50">50</option> 
 
\t \t \t \t <option value = "100">100</option> 
 
\t \t \t </select> 
 
\t \t \t <input type = "button" value = "show option value" onclick = "showOptionValue()"/> 
 
\t \t </form> 
 
\t </body> 
 
</html>

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

Надеюсь, это поможет!

источник

2014-10-15 12:02:32

Атрибут кнопки * onclick * может быть просто «alert (this.form.select_test.value)». Элементу select не нужен атрибут идентификатора. Но это не отвечает на вопрос ... – RobG

Предположительно нижний колонтитул скрыт по умолчанию. Если вы хотите, чтобы показать подвал, если 50 или 100 выбраны, то:

$(document).ready(function() { 
    $('select[name=DataTables_Table_0_length]').change(function() { 

     if (this.value == '50' || this.value == '100') { 
      $("#tfoot").show(); 

     } else { 
      $("#tfoot").hide(); 
     } 
    }); 
});

или

$(document).ready(function() { 
    $('select[name=DataTables_Table_0_length]').change(function() { 
     this.value == '50' || this.value == '100'? $("#tfoot").show() : $("#tfoot").hide(); 
    }); 
});

или даже:

$(document).ready(function() { 
    $('select[name=DataTables_Table_0_length]').change(function() { 
     $("#tfoot")[this.value == '50' || this.value == '100'? 'show' : 'hide']() 
    }); 
});

источник

2014-10-15 12:22:04 RobG

Спасибо за этот ответ, работает отлично. – dddexxx

Проверьте, выбраны ли опции выбора

ответ

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