How to use jquery accordion in a jquery dialog
Hi,
Iam using this code for my online shopping site.This code is used for quick view of an product.While user click the quick view a dialog open and show the product image,price,description.Now the issue is the description is lengthy.So it display dialog broader.(It increase the dialog width according to description).So that i want to use Accordion.But i dont have idea about how to use this.i read this
http://jqueryui.com/accordion/.
But i dont know what i need to download here
http://jqueryui.com/download/.I want to show the description like this
http://jqueryui.com/accordion/.
Can anyone tell me what version i have to download and how to use that based on the below code?Sorry for the basic questions.
<link type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/ui-darkness/jquery-ui.css" rel="stylesheet">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<script type="text/javascript">
$(function () {
debugger;
$("#dialog").dialog({
modal:true,
autoOpen: false,
draggable:false,
resizable: false,
width: "auto"
});
$(".dialogify").bind("click", function(e) {
e.preventDefault();
$("#dialog").dialog('option', 'title', $(this).next().find('img').attr('title'));
$("#dialog").html("<img src='" + $(this).next().find('img').attr('src') + "' width='150' + height='150'>"+"<label>"+ $(this).next().find('img').attr('price')+"<br />"+"</label>"+"<label>"+$(this).next().find('img').attr('desc')+"</label>"+"<br />"+"<input type='button' value='@(Model.ProductPrice.AvailableForPreOrder ? T("ShoppingCart.PreOrder") : T("ShoppingCart.AddToCart"))' class='button-2 product-box-add-to-cart-button' onclick='AjaxCart.addproducttocart('@addtocartlink ');return false;' />")
$("#dialog").dialog("option", "position", {
modal:"true",
my: "center",
at: "center",
title:"title",
of: window
});
if ($("#dialog").dialog("isOpen") == false) {
$("#dialog").dialog("open");
}
});
});