{{block class="" name="" template="" }} - Get phtml template script partially working on CMS page

Question

If i using sinlge script in cms pahe it is working,

{{block class="Amasty\Storelocator\Block\Location" name="location.block.home" template="Zero_Storelocator::home-page-mobile1.phtml" }}

If i add two more script in cms page it is not working,

{{block class="Amasty\Storelocator\Block\Location" name="location.block.address" template="Zero_Storelocator::home-page-mobile1.phtml" }}
{{block class="Amasty\Storelocator\Block\Location" name="location.block.mobile" template="Zero_Storelocator::home-page-mobile2.phtml" }}
{{block class="Amasty\Storelocator\Block\Location" name="location.block.hours" template="Zero_Storelocator::home-page-mobile3.phtml" }}

Each script working when i call individually, if i call all the script at the same time first line of the script only working, the remaining script not working.

Code:

         if (response && _.isArray(response.items) && self.options.homeHeader && self.options.commonBlock && self.options.homePage && self.options.homeMobile && self.options.homeHours) {
            response.items = [_.first(response.items)];
            response.totalRecords = 1; 
        }

    ..............
    ..............
    ..............


    if (self.options.homePage) {
        var homeAddress = '';
        var firstStore = _.first(locations.items);
        if (firstStore.distance) {

            homeAddress = '<div class="homepage-store">' + firstStore.address + ',' + firstStore.state + ' ' + firstStore.zip + '</div>';

        }
        console.log(homeAddress);
        self.storeListIdentifier.html(homeAddress);
    }

    if (self.options.homeMobile) {
        var homeMobileaddress = '';
        var firstStore = _.first(locations.items);
        if (firstStore.distance) {

                homeMobileaddress = '<div class="homepage-store">' + firstStore.phone + '</div>';

        }
        console.log(homeMobileaddress);
        self.storeListIdentifier.html(homeMobileaddress);
    }

    if (self.options.homeHours) {
        var homeHoursstore = '';
        var firstStore = _.first(locations.items);
        if (firstStore.distance) {

                homeHoursstore = '<div class="homepage-store">' + firstStore.store_hours_weekdays +' ,' +firstStore.store_hours_weekend_days+ '</div>';

        }
        console.log(homeHoursstore);
        self.storeListIdentifier.html(homeHoursstore);
    }

Answer 1

1. First of all, your block names should be unique (you added to all of them the name="location.block").
2. Once you add the unique names, if the problem persists, then I am assuming there are some script lines which cause conflicts, so in this case, check your browser console to see what's going on.