Проверьте переключатель по ссылке в ссылке - PullRequest
0 голосов
/ 19 октября 2019


Я создал собственный сайт электронной коммерции с PHP OOP. Есть форма вопроса, в первом вопросе есть 3 флажка:

 1. Daily
 2. Weekly
 3. Monthly

И на моей домашней странице есть 3 <a> кнопок ссылок:

 1. Order Daily
 2. Order Weekly
 3. Order Monthly

Я хочу, чтобыкогда я нажимаю Order Daily, он направляет меня на страницу с вопросом, но по умолчанию он должен выбрать Daily, то же самое с 2 другими кнопками и 2 другими переключателями. Я не знаю, как я могу это сделать. Вот скриншоты:
См. Снимок экрана 1
См. Снимок экрана 2
Теперь, смотрите на втором снимке экрана, что я поместил ссылкив этих 3 кнопках выбрать по умолчанию в соответствии со ссылкой на кнопку defaultSelect="monthly", defaultSelect="weekly" & defaultSelect="daily", но я не знаю, как заставить ее работать в jQuery.
Вот код html домашней страницы:

<div>
    <a class="btn btn-sm btn-danger" href="customize-package.php?questions=<?php echo $result['pro_id']; ?>&defaultSelect=monthly">Order Monthly</a>
</div>
<div>
    <a class="btn btn-sm btn-danger" href="customize-package.php?questions=<?php echo $result['pro_id']; ?>&defaultSelect=weekly">Order Weekly</a>
</div>
<div>
    <a class="btn btn-sm btn-danger" href="customize-package.php?questions=<?php echo $result['pro_id']; ?>&defaultSelect=daily">Order Daily</a>
</div>

Вот вопросы из HTML-кода:

<div class="select_package_validity">
    <h5 class="h5-responsive font-weight-bold q1_text"></h5>
    <div class="package_validity_child">
        <div class="custom-control custom-radio custom-control-inline ml-4 plan_name_daily">
            <input type="radio" class="custom-control-input plan_name" id="daily" name="plan_name_selector" value="Daily">
            <label class="custom-control-label" for="daily">Daily</label>
        </div>
        <div class="custom-control custom-radio custom-control-inline ml-4 plan_name_weekly">
            <input type="radio" class="custom-control-input plan_name" id="weekly" name="plan_name_selector" value="Weekly">
            <label class="custom-control-label" for="weekly">Weekly</label>
        </div>
        <div class="custom-control custom-radio custom-control-inline plan_name_monthly">
            <input type="radio" class="custom-control-input plan_name" id="monthly" name="plan_name_selector" value="Monthly">
            <label class="custom-control-label" for="monthly">Monthly</label>
        </div>
    </div>
    <input type="hidden" name="plan_name" class="form-control selected_plan_name" />
</div>

Вот код jQuery:

$('input[name="plan_name_selector"]:first').attr("checked", true);

Как мне сделать так, чтобы выбрать переключатель по ссылке? Пожалуйста, помогите мне

Ответы [ 4 ]

0 голосов
/ 19 октября 2019

У меня есть Google, тогда я обнаружил, что, как получить параметр URL с помощью jQuery идеальным способом. Затем я ставлю if else условие и вижу, Это сработало для меня супер идеально.

var getUrlParameter = function getUrlParameter(sParam) {
    var sPageURL = window.location.search.substring(1),
        sURLVariables = sPageURL.split('&'),
        sParameterName,
        i;

    for (i = 0; i < sURLVariables.length; i++) {
        sParameterName = sURLVariables[i].split('=');

        if (sParameterName[0] === sParam) {
            return sParameterName[1] === undefined ? true : decodeURIComponent(sParameterName[1]);
        }
    }
};

var defaultRadioPlan = getUrlParameter('defaultPlanSelect');
if(defaultRadioPlan === 'oneday'){
    $('.plan_name_oneday input').attr("checked", true);
} else if(defaultRadioPlan === 'weekly'){
    $('.plan_name_weekly input').attr("checked", true);
} else if(defaultRadioPlan === 'monthly'){
    $('.plan_name_monthly input').attr("checked", true);
}
0 голосов
/ 19 октября 2019

Пожалуйста, отправьте значение defaultSelectRadio из контроллера

var selectRadiovalue = '' $ ("input [name = plan_name_selector] [value =" + selectRadiovalue + "]"). Prop ('checked', true);

0 голосов
/ 19 октября 2019

Этот код jQuery будет полезен для получения значения defaultSelect из URL и проверки переключателя.

$(document).ready(function(){
  // Get Options in URL seprated by '?'
  var url = window.location.search;

  // Remove First Character '?' from URL string
  url = url.substr(1);

  // Split URL options and create array by '&' character
  var urlArr = url.split('&');

  //Loop through each Element of Array
  $.each(urlArr, function(){   
    // Create Variables dynamically and assign values using '=' sign
    window[this.split('=')[0]] = this.split('=')[1].toLowerCase();
  });

  // Loop throught each Input Radio
  $('.select_package_validity').find('input.custom-control-input').each(function(){

    // Get Radio button value
    var radioVal = $(this).attr('value').toLowerCase();

    // Match radio value and dynamically created 'defaultSelect' value
    if(radioVal == defaultSelect){
      // If values are same, check radio button
      $(this).attr('checked', true);
    }
  });
});
0 голосов
/ 19 октября 2019

В пределах вашего customize-package.php вы должны получить текущее значение dailySelector с URL-адреса

if( isset( $_GET['dailySelector'] ) ) {
    $dailySelector = $_GET['dailySelector'] 
} else {
    $dailySelector = 'daily';
}

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

<script>

$(document).ready(function() {
    var dailySelector = '<?php echo $dailySelector; ?>';
    $('#' + dailySelector).prop('checked', true);
});
</script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...