atulthakre Posted May 17, 2014 Share Posted May 17, 2014 i have the following html and javascript, how can i shorten the javascript ? html and javascript at - http://jsfiddle.net/GZhvM/2/ Link to comment Share on other sites More sharing options...
Ingolme Posted May 17, 2014 Share Posted May 17, 2014 It could be shortened by changing the HTML a bit: HTML <button class="opener" data-dialog="1">open the dialog</button><div id="dialog1" class="dialog" title="Dialog Title">I'm a dialog</div><button class="opener" data-dialog="2">open the dialog 2 </button><div id="dialog2" class="dialog" title="Dialog Title">I'm a dialog 2</div><button class="opener" data-dialog="3">open the dialog 3 </button><div id="dialog3" class="dialog" title="Dialog Title">I'm a dialog 3</div> Javascript $( ".dialog" ).dialog({ autoOpen: false });$( ".dialog" ).dialog( "option", "width", 500 );$( ".dialog" ).dialog( "option", "height", 400 );$( ".opener" ).click(function() { var selector = "#dialog" + $(this).data("dialog"); $(selector).dialog( "open" );}); Link to comment Share on other sites More sharing options...
dsonesuk Posted May 17, 2014 Share Posted May 17, 2014 (edited) Change id ref to classes <button class="opener">open the dialog</button><div class="dialog" title="Dialog Title">I'm a dialog</div><button class="opener">open the dialog 2 </button><div class="dialog" title="Dialog Title">I'm a dialog 2</div><button class="opener">open the dialog 3 </button><div class="dialog" title="Dialog Title">I'm a dialog 3</div> use index of button with class 'opener' to reference its 'dialog' box index $( ".dialog" ).dialog({ autoOpen: false });$( ".opener" ).click(function() { //$('.dialog').dialog( "close" ); //will close all opened dialog box before opening new one if needed var curr_open_index = $('.opener').index(this) $('.dialog:eq('+curr_open_index +')').dialog( "open" );});$( ".dialog" ).dialog( "option", "width", 500 );$( ".dialog" ).dialog( "option", "height", 400 ); No extra attributes, in fact you lose one the id ref Edited May 17, 2014 by dsonesuk Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now