After much work I have managed to move all the information from the Customization page on a Bundled Product to the front page. I now want to hide the buttons that direct the user to the customization page. Both buttons however use the save class name.
There are two separate buttons on this page : I need to hide the first button
Button 1 which is:
<div class=“product-shop”>
<div class’Product-main-info”>
<div>
<button class="button btn-cart" type="button" onclick="Enterprise.Bundle.start();">
<span>
<span>Customize and Add to Cart</span>
</span>
</button>
</div>
</div>
Button 2 is:
<div class="add-to-cart">
<label for="qty">Qty:</label>
<input id="qty" class="input-text qty" type="text" title="Qty" value="1" maxlength="12" name="qty">
<button class="button btn-cart" onclick="productAddToCartForm.submit(this)" title="Buy Now" type="button">
<span>
<span>Buy Now</span>
</span>
</button>
</div>
I have tried hiding the button using CSS however have only been able to switch both buttons off. This the last step in a long Magento GO customization project. Any help much appreciated.
Regards
Mark
Related
I have a form with some input fields (text-input). Then i have a button at the bottom that says "Continue" and inside the form is a collapse-div (bootstrap 4). When the button is clicked the button moves to the bottom and two checkboxes are visible.
My goal is to make this button act like this:
First time click, the div collapses open and two checkboxes are visible
The button moves down (working at this point) and the submit button changes text to "continue" to "Submit" and it should work as a submit button (not collapse the div again)
This is the code:
<div class="collapse" id="collapseExample">
<div class="form-check">
<input class="form-check-input" type="checkbox" value="" id="checkbox1">
<label class="form-check-label" for="checkbox1">
label for checkbox 1
</label>
<input class="form-check-input" type="checkbox" value="" id="checkbox2">
<label class="form-check-label" for="checkbox2">
label for checkbox 2
</label>
</div>
</div>
<button type="button" class="btn btn-warning btn-lg" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">Continue</button>
I could either use jQuery to remove the first button and append/add a submit button but what would be the best method (use the same button or remove it and append a new submit button). Something ala this:
$('button[data-toggle="collapse"]').click(function() {
/* Remove the "continiue"-collapse button and append a new one */
});
If someone have any idea it would be nice to get som input.
Thanks!
I am working on a pretty web application that connects to a RESTful API. My HTML has a "View Employees" button that when clicked, makes an API call to grab all the employees for that company. I am checking the return for the API, and it's getting the entire list, but the page is only rendering the first employee and then blank spaces for the rest. Things get stranger when I go to a different company and click on their View Employees button, because the employees for that company appear, AND one of the blank spaces in the previous company suddenly renders properly. I'm reading the return from the API, and it has all the information I need in a properly formatted way. I'm really confused.
Anyone have any idea what's going on? Here's my HTML. If you need more code please let me know.
<div ng-if="sigFigCtrl.companies[$index].employees.length > 0">
<div class="employee-box" ng-repeat="employee in sigFigCtrl.companies[$index].employees">
<span class="glyphicon glyphicon-edit pull-right" ng-click="sigFigCtrl.toggleEmployeeEdit($index)"></span>
<span class="glyphicon glyphicon-remove pull-right" ng-click="sigFigCtrl.deletePerson(employee._id, $index, sigFigCtrl.companies[$parent.$index].employees)"></span>
<div ng-if="!sigFigCtrl.companies[$index].editEmployee">
<div ng-if="sigFigCtrl.companies[$index].employees.length > 0">
<p><b>Name:</b> {{employee.name}}</p>
<p><b>Email:</b> {{employee.email}}</p>
</div>
</div>
<div ng-if="sigFigCtrl.companies[$index].editEmployee">
<form name="editPersonForm" ng-submit="sigFigCtrl.editPerson(employee._id, $index)">
<div class="form-group">
<div class="col-md-12">
<input type="text" ng-model="sigFigCtrl.editPersonName" id="name" placeholder="Name of Employee" class="form-control" required></input>
</div>
</div>
<div class="form-group">
<div class="col-md-12">
<input type="text" ng-model="sigFigCtrl.editPersonEmail" id="name" placeholder="Email of Employee" class="form-control" required></input>
</div>
<button>SUBMIT</button>
</form>
</div>
</div>
</div>
</div>
Thank you in advance.
basically I have a webpage which triggers a modal containing an HTML form, this form has tabs that you can control with href values, however whenever I click on an anchor link it affects the parent page, but no the modal form.
Normally if the form is not in a modal and is implemented directly on an HTML page the href links work into moving the tabs of the form. However when I make the form into a modal from another page I have this problem.
Any solutions or javascript workarounds?
Here is the form inside the modal
<div class="tab-content ">
<div class="tab-pane active" id="panel6-1">
<div class="row-fluid">
<div class="span5"> <h4><i class="icon-user"></i> Property Details</h4>
<label>Selected Address : </label>
<input type="text" value="<?php $result = getAdressFromLatLng($_GET["lat"],$_GET["lng"]); echo $result->address; ?>" class="input-block-level" />
<label>Property Type </label>
<select>
<option id="">Residential</option>
</select>
<label>Property Subtype </label>
<select>
<option id="">Residential</option>
</select>
<label>
<button type="button" data-toggle="button" class="btn btn-mini custom-checkbox active"><i class="icon-ok"></i></button>
</label>
<br />
//here is the href that when I click on I want to show the panel6-2
Go to next tab<i class="icon-chevron-sign-right"></i>
</div>
Perhaps setting the target of the href in the modal to the name or id of the modal window? Otherwise could wrap in modal form in an iframe.
I have a form with multi checkbox which is required field that I turned into twitter bootstrap toggle buttons.
I am trying to activate a selection button with js, by adding 'active' class to it.
I am able to add the class but when saving the form I am getting an error that the field is required.
What am I missing?
Here is the form.
<div id="reminder">
<div class="btn-group" data-toggle="buttons">
<label class="btn btn-primary">
<input type="checkbox" name="reminder" id="id_reminder_1" value="1" title="Choose at least one reminder option">Now</label>
<label class="btn btn-primary">
<input type="checkbox" name="reminder" id="id_reminder_2" value="30" title="Choose at least one reminder option">30m</label>
<label class="btn btn-primary">
<input type="checkbox" name="reminder" id="id_reminder_3" value="60" title="Choose at least one reminder option">1h</label>
<label class="btn btn-primary active">
<input type="checkbox" name="reminder" id="id_reminder_4" value="120"
title="Choose at least one reminder option">2h</label>
<label class="btn btn-primary">
<input type="checkbox" name="reminder" id="id_reminder_5" value="1440"
title="Choose at least one reminder option">1d</label>
</div>
</div>
This is how I am adding the class:
$('#reminder label:eq(3)').addClass('active')
You're only adding the class, but you don't actually select it. Add the selected attribute and it will work:
$('#reminder label:eq(3)').addClass('active').attr('selected',true);
Here is a demo
Add class open not active to open the dropdown (if thats what you are trying to do). You have to add the class to <li class='dropdown open'> which hosts the <ul class='dropdown-menu'>
btn-primary is the css that will make your buttons blue. It looks like this is what you are using for inactive buttons because the way you have your code, all the buttons should be blue. If you are trying to make the button grey because grey will be your active button, then you can use removeClass('btn-primary'). This will turn it grey. Hope this helps.
I'm working on a school project in Java. I'm able to login user successfully who registered. But when he/she loged-in how can I hide Login and Register page link and replace them with MyAlumni. And after sign-out how can I show them again.
Here is the coding of my links on MasterPage
<td id="menucontainer" align="center">
<br>
<button id="homeBtn" onclick="window.location.href='Main.do'"></button>
<br>
<button id="loginBtn" onclick="window.location.href='ForwardGeneralAction.do?page=Login'"></button>
<br>
<button id="signupBtn" onclick="window.location.href='ForwardGeneralAction.do?page=SignUp'"></button>
<br>
<button id="helpBtn" onclick="window.location.href='ForwardGeneralAction.do?page=Help'"></button>
<br>
<button id="contactBtn" onclick="window.location.href='ForwardGeneralAction.do?page=Contact'"></button>
<br>
Please explain me step by step what I have to do. Many thanks
Most of the time, site will have a login.master to handle the login stuff, and like a site.master or default.master to handle the rest of it. I would suggest this in your case, too. You'd just put the login/register menu in login.master, and then the other menu in site.master.
In response to your comment, wherever your current master page is, add another one (right click, add, new item, master page) and copy the header type stuff from your other master page (sorry, I haven't done any web dev in java so I don't know the exact syntax)
And then your login master page (at least the menu part of it) will look like this:
<td id="menucontainer" align="center">
<br>
<button id="homeBtn" onclick="window.location.href='Main.do'"></button>
<br>
<button id="loginBtn" onclick="window.location.href='ForwardGeneralAction.do?page=Login'"></button>
<br>
<button id="signupBtn" onclick="window.location.href='ForwardGeneralAction.do?page=SignUp'"></button>
and then your other master page (the menu part) will look like this:
<td id="menucontainer" align="center">
<br>
<button id="homeBtn" onclick="window.location.href='Main.do'"></button>
<br>
<button id="alumniBtn" onclick="window.location.href='MyAlumni.do'"></button>
<button id="helpBtn" onclick="window.location.href='ForwardGeneralAction.do?page=Help'"></button>
<br>
<button id="contactBtn" onclick="window.location.href='ForwardGeneralAction.do?page=Contact'"></button>
The rest of the master page stuff is up to you!