I apologize in advance as I'm not able to get the minimal amount of code possible, but I'm currently working on a Shopify site (that I didn't build) and I want to have no default variants selected. For example, if you go to this page https://thriveworkwear.com/products/carpenter-work-pants-5300-pro, you'll see that the default options are Color: Hickory Waist:30W Inseam:30L.
Is there a way to disable the default variant functionality? Meaning that no variants are selected and the user has to select them manually.
I tried to follow this guide https://help.shopify.com/en/themes/customization/products/variants/how-to-add-a-pick-an-option-to-drop-downs and this one but they DIDN't work.
I have also tried adding this:
document.querySelector('input[name="name0"]:checked').checked = false;
document.querySelector('input[name="name1"]:checked').checked = false;
document.querySelector('input[name="name2"]:checked').checked = false;
to the theme.js file but it didn't work. It seems to work if I add it through the console tab but not when I add it on the site.
Any help is appreciated.
It seems that the options are generated from the following APP: https://apps.shopify.com/best-custom-product-options
This means that everything is generated using Javascript that you may not have control over.
You will have to reveal the App if there is an option in it to disable the default selected options or if there is an event you can listen to when the App applies the options.
The final line is to use Mutation Observer and wait for HTML modifications in the form to fire your code, but this is the final approach if nothing else works.
Related
I have a site built with Asp.Net mvc where I show a list of products and automatically fill in the default purchasing amount for those products in each corresponding input field.
However when i navigate to a different product catalog using the anchor tag the 'Changes may not be saved' alert pops up presumably because of the default values entered in the input fields.
Now I have tried to disable this alert using the following in my shared layout page inside of a script tag:
window.onbeforeunload = null
window.beforeunload = null
I have also tried various answers from similar questions but nothing seems to help.
Does anyone know how I can get rid of this alert?
Thanks in advance.
You may have more success using this for jQuery:
$(window).off('beforeunload');
You can also read about some of the caveats and potential pitfalls of the beforeunload event here.
Update:
Just to clarify a point further from a comment #Jamiec left, the event should be triggered in your project somewhere, try searching for beforeunload to see where it originates.
Apparantly the alert was being called from a directive created by a colleague, by disabling this directive the alert no longer appears.
Thanks to Jamiec for notifying me.
Using Jquery Try below code.
$(window).off('beforeunload');
This is best option for changes that you made may not be saved popup.
If you use javascript then you can use below code,
window.onbeforeunload = function () {return null;};
I am trying to select a desired value from dropdown menu in browser developer tools with Javascript. The following picture shows the content of the page.
But whenever I select another value with code and then click the save button, the changes are not actually saved. When I select normally with my mouse and click the save button, it changes normally.
I have tried the following stuff. These seemingly changed the value of selected dropdown menu (it shows 2 when I write the code) but cannot be saved afterwards.
1- document.getElementById('channel24g_ctrl')[2].selected = true
2- document.getElementById('channel24g_ctrl').options.selectedIndex = 2
3- document.getElementById('channel24g_ctrl').options[2].selected = true
4- document.getElementById('channel24g_ctrl').options[2].click()
5- document.getElementById('channel24g_ctrl').options[2].setAttribute("selected", "selected");
document.getElementById('channel24g_ctrl').options[1].removeAttribute("selected");
I might have tried some other combinations of those above.
Only the fifth actually makes target option "selected" but it still doesn't work when save button is clicked. I am no expert with javascript or ember but I have done similiar things before with other websites and succeeded. So maybe the problem is with Ember Framework?
What else can I do?
Apparently, selecting an option alone is sometimes not enough. change() must be called after selecting the option in order to apply changes. The following piece of code made the trick:
document.getElementById('channel24g_ctrl').options[2].selected = true;
$(document.querySelector('#channel24g_ctrl')).change();
document.getElementById('wifi_wizard_save').click();
document.getElementById('personlist').getElementsByTagName('option')[11].selected = 'selected'
I am currently working on project and i have requirement to use java script input dialog to take input from user
see example
now i want to remove this check box which says that prevent this page from creating additional dailogs
how i can remove this message from alert box
You cant remove because it's introduced by browser.
To solve you problem try to employ http://bootboxjs.com/, whit this library you ca do the same by writing:
bootbox.prompt("Enter password please", function(result) {
// do something whit result
});
You can't remove this as it's a browser security feature. You should probably look at other ways of presenting your dialog - use a modal window instead for example.
So what you want to do it's IMPOSSIBLE. Since it's a browser functionality.
Anyway I advice you to use a Model-Box.
You will:
- Prevent that from happen
- Beautify your website.
You may want to check this: http://www.fallr.net/ I've used it's pretty cool and easy. Tou have the PROMPT-LIKE example wich returns you something written by the user. You can also have a CALLBACK to some AJAX function for example.
So you can't remove it make that clear for you at least for now.
Dont use alert system boxes they are ugly.. really..
Hope it helped!
i fount the answer
We have two different things going on here...
I'm suggesting adding a preference to about:config (or user.js in your
profile folder).
Copy the preference name dom.successive_dialog_time_limit Open
about:config Right-click in the preferences area and choose New >
Integer Paste the preference name and click OK Then enter 0 and click
OK
for more details chek this link
Prevent this page from creating addtional dialogs
I've got a page where I'm using JavaScript to enable \ disable controls based on what is selected, such as:
var selectableItems = document.getElementById('holder_wizard_pnlSelectableItems');
selectableItems.disabled = true;
This works perfectly fine in IE, but in Chrome it doesn't do anything. I did manage to disable the options for a RadioButtonList with the code below, but can't seem to translate that into anything else.
$("#holder_wizard_pnlContactRequest :input").attr('disabled', true);
Ideally what I want to do is disable a button and a drop down list and be able to re-endable them. There are numerous posts recommending using CSS for this, but that is just a styling change. I actually want to enable / disable them properly within Chrome.
The controls I want to change the state of are a btnAdd and ddlProducts but nothing I seem to do alters them, then the code I posted adding the attribute didn't change the state of the button even though that is also seen as an input.
Try this..
document.getElementById("holder_wizard_pnlContactRequest ").setAttribute('disabled', true);
Or
document.getElementById('btnAdd').disabled='true';
I used AspTokenInput Which is used as AutoComplete TextBox to create Tags .
I use this Link To know How to Use it.
It's Works Fine For Me and give Result As I want.
Now I want to Make This Control Enabled or Disabled On a Button Click according To Condition.
I Use this on Button Click
AspTokenInput.Enabled = "False"
But it's not Working...
Your problem is that the jQuery Tokeninput field cannot be disabled serverside.
See (http://loopj.com/jquery-tokeninput/) for documentation on this library if you want to try and finagle the js on and off. At a glance, I don't see an enable/disable flag or method. You may need to dig into the ASPTokenInput library to see how it pulls its data source, and then enable/disable the plugin with:
$("#my-text-input").tokenInput("clear"); //disable
$("#my-text-input").tokenInput("/url/to/ASPTokenInput/Datasource/");//reenable
The problem with this approach is that it basically goes around the ASPTokenInput layer, which kind of defeats the point.
My secondary approach was to try a hack, but hiding the dropdown isn't the greatest solution (or even easy in this case), nor is having the check box swap the autocomplete input for another. Swapping text boxes is probably the simplest solution.