Показывать оповещение, когда один div был нажат, а другой нет

0

Надеюсь, это возможно, и кто-то может помочь. В принципе, я создал форму "Зарегистрироваться" пакета, поэтому пользователи могут выбирать, какие функции пакета они хотят включить, увидеть цену, а затем зарегистрироваться для пакета.

Пользователь выбирает свой выбор из выпадающих прямоугольников, нажимает кнопку "Добавить", чтобы увеличить цену пакетов, а затем, когда они счастливы, они могут нажать "Зарегистрироваться" для отправки.

Мне нужно, чтобы это произошло, если пользователь использует раскрывающийся список, выбирает параметр, но не нажимает кнопку "Добавить", он должен получить сообщение с сообщением, чтобы нажать "Добавить", прежде чем продолжить, если они нажмут "Зарегистрироваться". Пример можно найти по адресу http://pure.evolvedublin.com/broadband (нажмите "Запустить" в калькуляторе затрат)

Надеюсь это имеет смысл!

Мой HTML:

<div class="styled-select">
    <select id="broadband_package1" name="broadband_package1">
        <option value="0" checked="checked">No Thanks!</option>
        <option value="1">Package 1</option>
        <option value="2">Package 2</option>
        <option value="3">Package 3</option>
        <option value="4">Package 4</option>
    </select>           
</div>
<a href="#" title="Add" class="chat calculate-total1" id="calculate-total">Add</a>



<div class="homepage-content-small">
    <h2>Happy with your new bill?</h2>

    <input type="submit" value="Sign Up" title="Sign Up" class="chat signup">
    <small class="make_sure" style="display:none;">Make sure to Add your desired add on</small> 
</div>

JQuery, который я начал до сих пор:

jQuery(".signup").click(function() {

    if (".calculate-total1"):not(click){
    jQuery(".make_sure").show();
    else {
    jQuery(".make_sure").hide();
});

На данный момент я просто не могу найти способ сделать это со всем, что я пробовал.

Спасибо, ребята, любая помощь будет оценена

Теги:
click

4 ответа

2
Лучший ответ

Исходя из решения Богдана. Мне показалось, что вы не хотите, чтобы div.make_sure показывал, что они вообще ничего не выбрали, так что это реализация этого.

$(document).ready(function ($)
{
    var totalCalculated = false;

    $('.calculate-total1').click(function ()
    {
        totalCalculated = true;
    });

    $('.signup').click(function ()
    {
        if ($("#broadband_package1").val() == "0|No Broadband Package" || totalCalculated)
        {
            //$(".make_sure").hide();
            alert("You Can't See Me");
        }
        else
        {
            //$('.make_sure').show();
            alert("Did You Forget to Add Your Package?");
        }
    });
});

Вот ссылка на скрипт: http://jsfiddle.net/W2aR3/11/

Поделиться
  • 0
    Привет @ Брэндон. Это близко к тому, что я ищу, но не совсем так. Я хочу, чтобы сообщение отображалось, если пользователь использовал опцию выбора, но не нажал кнопку Добавить. Поэтому, если они выбирают какой-либо параметр, кроме первого, им нужно нажать кнопку Добавить, прежде чем зарегистрироваться. Если они выберут первое «Нет, спасибо», то они могут действовать как обычно. Причина этого заключается в том, что выбранный параметр должен добавить к промежуточному итогу. Промежуточный итог обновляется только после нажатия кнопки «Добавить».
  • 0
    Кроме того, я только что реализовал ваш код, и он, кажется, показывает предупреждение «Вы не можете видеть меня» для всех сценариев на данный момент - он, похоже, не переносится на другие.
Показать ещё 18 комментариев
3

Вы можете использовать переменную gloval.

jQuery(function ($) {

    var totalCalculated = false;

    $('.calculate-total1').on('click', function () {
        totalCalculated = true;
    });

    $('.signup').on('click', function (e) {
        if (totalCalculated) {
            $(".make_sure").hide();
        } else {
            e.preventDefault();
            $('.make_sure').show();
        }
    });

});
Поделиться
  • 0
    Привет @ Богдан. спасибо за Ваш ответ. Я пытался реализовать это, но ничего не изменилось. Когда я нажимаю кнопку «Зарегистрироваться», форма все еще перемещается на страницу регистрации, и сообщения не отображаются.
  • 0
    Вы должны предотвратить это. Я изменяю код Добавлены параметры e и e.preventDefault() ;
Показать ещё 7 комментариев
0

Вставьте параметр attr data-choice = "false" на кнопку спуска. Когда пользователь нажал кнопку добавления кнопки, выберите attr data-choice = "true". Таким образом, вы можете управлять своими условиями на этом уровне.

Поделиться
0

Добавить скрытый ввод

<input type="hidden" name="is_added" value="0">

Добавьте метод onClick для привязки для установки этого значения скрытого элемента в 1 при нажатии

$("a#calculate-total").on("click", function(){
    $("input[name=is_added]").val("1");
})

Проверьте это значение перед регистрацией

if ($("input[name=hidden]").val() == "0")
{
    // not clicked
}
else
{
    // clicked
}
Поделиться
  • 0
    Спасибо @Batu за вашу помощь, однако, похоже, это пока не работает. Я добавил ввод перед a # Calculate-Total в HTML, а затем JQuery в заголовок. Я добавил alert('not clicked'); и alert('clicked'); там, где это уместно, но каждый раз, когда я обновляю любую страницу, я получаю предупреждение «Нажал». Кроме того, когда я нажимаю «Зарегистрироваться», форма просто регистрируется без отображения предупреждения.
  • 0
    Вам нужно проверить его значение в вашей функции $('.signup').on('click', function (){}) . На самом деле я рекомендую положить все ваши элементы в form . Добавьте onSubmit="return sign_up($(this))" в эту форму и проверьте значение в этой функции sign_up. Потому что таким образом вы также можете проверить значение в своем коде на стороне сервера.
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню