Drop in coverage by country groups

Question

As the title says, I have a problem with the dropdown that I made. It contains a list of countries to which the store can send. He can create a delivery region, give him a name, and then select all the countries that fall under that region. then add a price to it.

During the check, I want to get the list of countries provided by the web store and use it so that the customer can choose where he lives. Options for the country are those in which the store also ships its products. However, I ran into some problems.

The main problem is that the way it was designed is that you select a region that will reload the page with an additional parameter in the URL that will add the delivery region to the order that will be created. This is causing me a problem. Since he will always choose the bottom option of the drop-down list, and not the one that I just selected, this means that I can’t establish the country in which the person lives properly.

therefore if the dropdown menu

USA Singles China

and I will choose the USA, the page will reload, and China will depend

My code is:

Html dropdown

{% for shippingRegion in store.getShippingRegions %}
    <a style="display: none" id="addShippingRegion{{shippingRegion.id}}" href="{{ path('checkout', {'store_id': store.id, 'shippingRegion': shippingRegion.id}) }}"></a>
{% endfor %}

 <div class="collection">
     <select onchange="shippingRegionSelectCheck(this)" class="browser-default" id="shippingRegion" name="ShippingRegion">
           <option selected disabled>Select a shipping region</option>
              {% for key,country  in regionCountries %}
                  {% for c in country %}  = 
                    <option id="countrySelect" data-id="{{key}}" selected value="{{c}}" >{{c}}</option>   
                  {% endfor %}
             {% endfor %}
      </select>
</div> 

Javascript function reloading page

function shippingRegionSelectCheck(regionSelect){
    if(regionSelect){
         var selected = $('#shippingRegion').find('option:selected');
         var extra = selected.data('id'); 
         var country = $('#shippingRegion').val('value');
         var href = $('#addShippingRegion' + extra).attr('href');

         window.location.href = href; 
    }

}

Entity

/**
 * @ORM\Entity
 * @ORM\Table(name="Shipping_Regions")
 */
class ShippingRegion{
    public function __construct() {
        $this->shipping_weight_prices = new ArrayCollection();
        $this->shipping_amount_prices = new ArrayCollection();
    }

    /**
     * @ORM\Column(type="integer")
     * @ORM\Id
     * @ORM\GeneratedValue(strategy="AUTO")
     */
    protected $id;

    /**
     * @ORM\Column(type="string", length=100, nullable=true)
     */
    protected $name;

    /**
     * @ORM\Column(type="boolean", nullable=true)
     */
    protected $regionType;

    /**
     * @ORM\Column(type="array", nullable=true)
     */
    protected $regionCountry;

Answer 1

, , - . , , , , HTML JS . nullable cId . ,

/**
     * @Route("/checkout/{store_id}/{shippingRegion}/{cId}", name="checkout", defaults={"shippingRegion" = null, "cId" = null})
     */
    public function showAction($store_id, $shippingRegion, $cId, Request $request)

foreach ($webstore->getShippingRegions() as $shippingRegions) {
            foreach ($shippingRegions->getRegionCountry() as $key=>$regionCountry) { 
// key being the ID used for countries
                  $regionCountries[$shippingRegions->getId()][$key] = Intl::getRegionBundle()->getCountryName($regionCountry);
             }  
    }

:

 {% for key,country  in regionCountries %}
    {% for id,c in country %}
       {% if shippingRegionEntity is defined and shippingRegionEntity is not null and key == shippingRegionEntity.getId and cId is defined  and cId is not null  and cId == id %}
         <option id="countrySelect" data-cId="{{id}}" selected checked data-id="{{key}}" >{{c}}</option>
       {% else %}
         <option id="countrySelect" data-cId="{{id}}" data-id="{{key}}" >{{c}}</option>
       {% endif %}                                      
    {% endfor %}
{% endfor %}

, , JS :

function shippingRegionSelectCheck(regionSelect){
    if(regionSelect){
         var selected = $('#shippingRegion').find('option:selected');
         var extra = selected.data('id'); 
         var country = selected.attr('data-cId');

         var href = $('#addShippingRegion' + extra ).attr('href')+ '/' + country;
         window.location.href = href; 

    }

}

Answer 2

, , "", , .

<option id="countrySelect" data-id="{{key}}" {{ c == selected_country ? 'selected' }} value="{{c}}" >{{c}}</option>