Блог

Главная - Вопросы по программированию - Как скрыть и отобразить текстовое поле html в соответствии с выбором dropbox- HTML, Python

Как скрыть и отобразить текстовое поле html в соответствии с выбором dropbox- HTML, Python

#jquery #python #html

#jquery #python #HTML

Вопрос:

У меня есть файл python validity.py . В этом файле у меня есть следующие функции:-

 def login():
    return '''
    <body bgcolor="#FFDEAD">
    <form action="/login" method="post">
        <img src='http://%s:%s/login/guavusLogo.png'>
        <h1>Validity</h1><br>
        <h2> Configuration Parameters</h2><br>
        <table>
        <tr>
        <tr><td><lable>Chose from the following</td><td> <select name="options">
            <option value="unhide">unhide</option>
            <option value="hide">hide</option>
        </select></td><tr>
        <td>Start Date: </td><td><input name="startDate" type="text" /></td></tr>
        <tr><td>End Date:</td><td> <input name="endDate" type="text" /></td></tr>
        </table>
        <input value="Submit" type="submit" />
    </form>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js">
    $("select").change(function() {
    if ($("select option:selected")[0].value == 'unhide') {
            $("[name='startDate']").show();
            $("[name='endDate']").show();
    }
    else {
            $("[name='startDate']").hide();
            $("[name='endDate']").hide();
         }
    });
    </script>
    <script type="text/javascript" src="%s:%s/login/validate.min.js"></script>
    </body>
''' %(host,port,host,port)

def yes():
...
...
do something
...
...

def no():
...
...
do something  
...
...

def do_login():
    startDate = request.forms.get('startDate')
    endDate = request.forms.get('endDate')
    callOptions = request.forms.get('options')
    paramList = [startDate, endDate, callOptions]
    if '' in paramList or None in paramList:
             return "<p>Insufficient Arguments Entered. Please enter all the arguments mentioned in the config page</p>"
    else:
            if callOptions == "yes":
                    yes()
            elif callOptions == "no":
                    no()

run(host=host, port=port, debug=True)

do_login()

Не беспокойтесь о том, как я переношу веб-страницу на сервер, потому что обо всем этом уже позаботились. Я хочу, чтобы при загрузке страницы на сервер текстовые поля startTime и EndTime были скрыты, если в раскрывающемся списке выбрано «нет», и отображались, если выбрано «да».

Итак, в функции do_login(), где я поставил условия if, что if callOptions == «no», тогда она вызывает указанную функцию, но я хочу, чтобы текстовые поля скрывались и наоборот.

Любая помощь? Спасибо

Ответ №1:

С помощью jquery (который вы, похоже, уже используете) вы можете сделать это на клиенте, не требуя какой-либо обработки на стороне сервера.

Это должно работать без изменений в вашем HTML:

 <script>
$("select").change(function() {
    if ($("select option:selected")[0].value == 'hide') {
        $("[name='startDate']").hide();
        $("[name='endDate']").hide();
    } else {
        $("[name='startDate']").show();
        $("[name='endDate']").show();
    }
});
</script>

Кроме того, это должно быть <label> , а не <lable> , и вы должны закрыть этот тег.

Комментарии:

1. Я отредактировал. Но все еще не работает? Правильно ли это?

2. Я думаю, что он не может получить jquery min.js файл.

3. Вам нужно закрыть тег script, т. е. <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> . Также вам нужно добавить открывающий тег script перед строкой $("select").change(function()

4. Спасибо:) Это сработало. Также они просто становятся невидимыми, есть ли какой-либо способ, которым я мог бы их отключить. Я имею в виду, что они также не работают?

5. Документация по jquery довольно хороша 🙂 Смотрите learn.jquery.com/using-jquery-core/faq / …