I have a div that produce search results on clicking search button. This is the view
and this is html div of it
<div class="bestil-menu__btn">
<a onclick="Searchcontrol(1)" class="btn btn_blue">Ændre datoeeller antal personer</a>
</div>
When I press the blue button
<div class="dins-searhc-luk" #Html.Raw(view2)>
<a id="btnclose" class="dinS-bluebuttonC" href="javascript:;">Luk</a>
</div>
it opens the search control and perform searches. I want to close it on pressing Luk anchor in below div to come as it was before. Please help me how to implement it into it. Thank you.
You can try something like
$('#btnclose').on('click', function(){
$(this).parent('div.dins-searhc-luk').hide();
});
Related
I have a quick view button inside a router-link and when I click it, the router-link keep submitting. I do not want the router-link to submit to the quick view button event. Instead I just want to show the quick view popup window right there. Something similar to this link
Unconditional. When you hover over the image a quick view button show and when you click it, the quick view window popup. And when you just click product image instead of the quick view button, it take you to a different page. That is what I want to achieve. How can I achieve this? If there is a different way to it, I would love to see that too.
<router-link tag="li" :to="{name: 'Product', params: {product}}"
v-on:click.native="getItem">
<div class="container">
<img :src="product.image" alt="" class="card-img">
<div class="overlay">
<button #click="active = true">Quick View</button>
</div>
</div>
</router-link>
This will resove the issue:
<button #click.prevent="active = true">Quick View</button>
.prevent modifier will prevent the button to do what is meant to do by deafult
Or you can do it by adding 'type="button"' to your button (it won't trigger the submit)
<button type="button" #click="active = true">Quick View</button>
What you are looking to do is to prevent the default action on the button click.
You can read about how to do this here: https://v2.vuejs.org/v2/guide/events.html#Event-Modifiers
<button v-click.prevent="onClick"></button>
Have a quick read of the docs as you also might want to use .stop
I am using this jquery plugin (Jquery Popup Overlay)
I have finally managed to have it working as expected, apart from the last step.
Once the pop up opens, there are 2 buttons. One is to close the window and one to progress with selected action(delete something in DB in this case).
I have this link to activate the window:
<a class="initialism basic_open btn btn-xs btn-danger" href="?page=suite-admin&action=delete-suite&id=5&site_id=1">delete suite</a></td>
This is the script to show the window:
$(document).ready(function () { $('#basic').popup({
escape: false,
blur: false, });});
What I need is , when pop up opens and i click on delete button this will progress with whatever is in .
I do not know much about Java, but i do really like this feature on my project.
Any help will be appreciated.
Thank you
Edit:
Forgot the actual pop up:
<div id="basic" class="well" style="display: none;">
<h4>Basic</h4>
<p>The dialog can be closed by pressing the <kbd>Esc</kbd> key, or by clicking on the background
<br> outside the content area, or by clicking on the Close button.</p>
<button class="basic_close btn btn-default">Close</button>
<button class="basic_close btn btn-danger">Delete Suite</button>
I think two possible answers (there are certainly more) to your problem can be found in this stackoverflow question: [How to create an HTML button that acts like a link?
To sum it up: One way would be to just use an <a> tag instead of <button>. That means you write:
<a class="basic_close btn btn-danger" href="?page=suite-admin&action=delete-suite&id=5&site_id=1">Delete Suite</a>
A simple search on Google for popup scripts brings out thousands of results for popup plugins.. But I believe something this simple shouldnt need a plugin.
I want a simple popup script with no overlay that does basically 3 things:
Opens on the click of a button
Closes on the click of a cross
Is centered on the screen and is fixed
<div class="member-pop" id="member-pop1">
<a class="member-close1 cross"><img src="img/pop/pop-cross.png"
alt="Close" /></a> <! -- This will close Popup -->
<p>Content inside popup</p>
</div>
What I have done so far
$('.pop-member1').click(function() {
$('#member-pop1').show();
});
$('.cross').click(function() {
$(this).parent().hide();
});
This achieves 1 and 2. Number 3 still not achieved yet
$( "#member-pop1" ).dialog();
<div id="member-pop1" title="My dialog">
<p>This is where you show the content. Click on cross to close me!</p>
</div>
Makes use of jquery ui dialog.
I am trying to click a div tag which is having an class name.
<div role="button" aria-haspopup="true" class="tableCell menu settings" data-type="settings">
<div class="carTitle" data-dojo-attach-point="_carTitle">xyz car </div>
</div>
Clicking on any div tag(i.e, class="tableCell menu settings" or class="carTitle"), redirects to next page but no operation was performed when tried this way.
var carSelector = 'div.carTitle';
...
casper.then(function() {
if (!this.exists(carSelector)) return;
this.click(carSelector);
});
Please help me, if i am going wrong somewhere?
Found similar question here but not of much help.
PS : In general, explain how to work with div tags(click operation) in casperjs ?
I am very new to this so apologise in advance for offending/upsetting anyone.
I have built my first website (http://www.goodgollyexeter.co.uk). There is a shopping cart on my website (I'm using Plum shop which is working great). I want the user to be able to click the "View Cart" button (in the top right hand corner on the website which has id="viewcart") and then for the contents of their cart to be displayed in a lightbox style window. The contents of their cart is contained within a <div> which has id="cart_holder".
To try and achieve the above I am using lightbox_me but I can't get it to work off of the "View Cart" button click event. If I remove the button click event coding then lightbox_me works and displays the contents of the cart but, as there is no event to trigger it, it opens as soon as the page loads. For now I have removed the button click event coding so if you were to visit the website you should see lightbox_me working (but on page load rather then a button click event).
I have tried to pick out the relevant code and show it below. This is the code that I have tried in order to get lightbox_me to work off of the "View Cart" button click event (adapted from lightbox_me website example) but this does not work:
<head>
<script src="js/jquery.js"></script>
<script src="js/jquery.lightbox_me.js"></script>
</head>
<body>
<button id="viewcart" class="viewcart">View Cart</button>
<div id="cart_holder">
<h1> Your Cart </h1>
<p>Currently your cart contains the following items:</p>
<div id="cart"></div>
<label>Items:</label> <span class="cart-quantity">0</span><br>
<label>Sub-Total:</label> <span class="cart-subtotal">£0.00</span><br>
<label>Shipping:</label> <span class="cart-shipping">£0.00</span><br>
<label>Total:</label> <span class="cart-total">£0.00</span><br>
<br>
Please click below to pay using a credit or debit card or via Paypal:
<br>
<br>
<button class="paypal">Checkout</input>
</div>
<script>
$("#viewcart").click(function() {
$("#cart_holder").lightbox_me();
});
</script>
</body>
When I add the above code lightbox_me stops working which is really annoying as if I remove the View Cart button click event coding so it reads like this:
<script>
$("#cart_holder").lightbox_me();
</script>
then lightbox_me works (but only on page load and not on button click event).
I don't know if it is of any use but when I inspected the <div id="cart_holder"> element in Chrome I did notice the following error message:
Uncaught TypeError: Object [object Object] has no method 'lightbox_me'
Due to my ignorance I'm afraid this means very little to me. If anyone could tell me what I am doing wrong and how to get lightbox_me to work from the "View Cart" button click event I would be very grateful indeed. Please let me know if I can explain anything better or post more code or anything else to better assist. Thanks Alex
Check your last closing button tag for checkout:
<button class="paypal">Checkout</input> <!-- should this close with button and not input? -->
Can you wrap your jquery like this?
;(function($){ // add
$(document).ready(function(){
$("#viewcart").button().click(function() {
$("#cart_holder").lightbox_me();
});
});
})(jQuery); // add