#46 Remove use of id in html markup to avoid collisions with multiple prompts

4 files changed, 69 insertions, 69 deletions

diff --git a/dist/jquery-impromptu.js b/dist/jquery-impromptu.js
index 6e23935..989d6e4 100644
--- a/dist/jquery-impromptu.js
+++ b/dist/jquery-impromptu.js
@@ -299,7 +299,7 @@
 

 			t.jqif.click(fadeClicked);

 			$window.resize({animate:false}, function(){ t.position(); });

-			t.jqi.find('.'+ opts.prefix +'close').click(t.close);

+			t.jqi.find('.'+ opts.prefix +'close').click(function(){ t.close(); });

 			t.jqib.on("keydown",keyDownEventHandler)

 						.on('impromptu:loaded', opts.loaded)

 						.on('impromptu:close', opts.close)

@@ -391,7 +391,7 @@
 				showHtml = 'Error: html function must return text';

 			}

 

-			state += '<div id="'+ opts.prefix +'state_'+ statename +'" class="'+ opts.prefix + 'state" data-jqi-name="'+ statename +'" style="display:none;">'+

+			state += '<div class="'+ opts.prefix + 'state" data-jqi-name="'+ statename +'" style="display:none;">'+

 						arrow + title +

 						'<div class="'+ opts.prefix +'message '+ opts.classes.message +'">' + showHtml +'</div>'+

 						'<div class="'+ opts.prefix +'buttons '+ opts.classes.buttons +'"'+ ($.isEmptyObject(stateobj.buttons)? 'style="display:none;"':'') +'>';

@@ -419,7 +419,7 @@
 					state += ' '+ ($.isArray(v.classes)? v.classes.join(' ') : v.classes) + ' ';

 				}

 

-				state += '" name="' + opts.prefix + '_' + statename + '_button' + v.title.replace(/[^a-z0-9]+/gi,'') + '" id="' + opts.prefix + '_' + statename + '_button' + v.title.replace(/[^a-z0-9]+/gi,'') + '" value="' + v.value + '">' + v.title + '</button>';

+				state += '" name="' + opts.prefix + '_' + statename + '_button' + v.title.replace(/[^a-z0-9]+/gi,'') + '" value="' + v.value + '">' + v.title + '</button>';

 			}

 			

 			state += '</div></div>';

diff --git a/dist/jquery-impromptu.min.js b/dist/jquery-impromptu.min.js
index 93d78ed..c008440 100644
--- a/dist/jquery-impromptu.min.js
+++ b/dist/jquery-impromptu.min.js
@@ -1,4 +1,4 @@
 /*! jQuery-Impromptu - v5.3.1 - 2014-11-16
 * http://trentrichardson.com/Impromptu
 * Copyright (c) 2014 Trent Richardson; Licensed MIT */
-(function(t,e){"function"==typeof define&&define.amd?define(["jquery"],e):e(t.jQuery)})(this,function(t){"use strict";var e=function(t,e){return t&&this.open(t,e),this};e.defaults={prefix:"jqi",classes:{box:"",fade:"",prompt:"",form:"",close:"",title:"",message:"",buttons:"",button:"",defaultButton:""},title:"",closeText:"&times;",buttons:{Ok:!0},loaded:function(){},submit:function(){},close:function(){},statechanging:function(){},statechanged:function(){},opacity:.6,zIndex:999,overlayspeed:"slow",promptspeed:"fast",show:"fadeIn",focus:0,defaultButton:0,useiframe:!1,top:"15%",position:{container:null,x:null,y:null,arrow:null,width:null},persistent:!0,timeout:0,states:{},state:{name:null,title:"",html:"",buttons:{Ok:!0},focus:0,defaultButton:0,position:{container:null,x:null,y:null,arrow:null,width:null},submit:function(){return!0}}},e.setDefaults=function(i){e.defaults=t.extend({},e.defaults,i)},e.setStateDefaults=function(i){e.defaults.state=t.extend({},e.defaults.state,i)},e.prototype={open:function(i,n){var o=this;o.options=t.extend({},e.defaults,n),o.timeout&&clearTimeout(o.timeout),o.timeout=!1;var s=o.options,a=t(document.body),r=t(window),f='<div class="'+s.prefix+"box "+s.classes.box+'">';f+=s.useiframe&&t("object, applet").length>0?'<iframe src="javascript:false;" style="display:block;position:absolute;z-index:-1;" class="'+s.prefix+"fade "+s.classes.fade+'"></iframe>':'<div class="'+s.prefix+"fade "+s.classes.fade+'"></div>',f+='<div class="'+s.prefix+" "+s.classes.prompt+'">'+'<form action="javascript:false;" onsubmit="return false;" class="'+s.prefix+"form "+s.classes.form+'">'+'<div class="'+s.prefix+"close "+s.classes.close+'">'+s.closeText+"</div>"+'<div class="'+s.prefix+'states"></div>'+"</form>"+"</div>"+"</div>",o.jqib=t(f).appendTo(a),o.jqi=o.jqib.children("."+s.prefix),o.jqif=o.jqib.children("."+s.prefix+"fade"),i.constructor===String&&(i={state0:{title:s.title,html:i,buttons:s.buttons,position:s.position,focus:s.focus,defaultButton:s.defaultButton,submit:s.submit}}),o.options.states={};var u,l;for(u in i)l=t.extend({},e.defaults.state,{name:u},i[u]),o.addState(l.name,l),""===o.currentStateName&&(o.currentStateName=l.name);o.jqi.on("click","."+s.prefix+"buttons button",function(){var e=t(this),i=e.parents("."+s.prefix+"state"),n=o.options.states[i.data("jqi-name")],a=i.children("."+s.prefix+"message"),r=n.buttons[e.text()]||n.buttons[e.html()],f={};if(void 0===r)for(var u in n.buttons)(n.buttons[u].title===e.text()||n.buttons[u].title===e.html())&&(r=n.buttons[u].value);t.each(o.jqi.children("form").serializeArray(),function(t,e){void 0===f[e.name]?f[e.name]=e.value:typeof f[e.name]===Array||"object"==typeof f[e.name]?f[e.name].push(e.value):f[e.name]=[f[e.name],e.value]});var l=new t.Event("impromptu:submit");l.stateName=n.name,l.state=i,i.trigger(l,[r,a,f]),l.isDefaultPrevented()||o.close(!0,r,a,f)});var p=function(){if(s.persistent){var e=(""+s.top).indexOf("%")>=0?r.height()*(parseInt(s.top,10)/100):parseInt(s.top,10),i=parseInt(o.jqi.css("top").replace("px",""),10)-e;t("html,body").animate({scrollTop:i},"fast",function(){var t=0;o.jqib.addClass(s.prefix+"warning");var e=setInterval(function(){o.jqib.toggleClass(s.prefix+"warning"),t++>1&&(clearInterval(e),o.jqib.removeClass(s.prefix+"warning"))},100)})}else o.close(!0)},d=function(e){var i=window.event?event.keyCode:e.keyCode;if(27===i&&p(),13===i){var n=o.getCurrentState().find("."+s.prefix+"defaultbutton"),a=t(e.target);a.is("textarea,."+s.prefix+"button")===!1&&n.length>0&&(e.preventDefault(),n.click())}if(9===i){var r=t("input,select,textarea,button",o.getCurrentState()),f=!e.shiftKey&&e.target===r[r.length-1],u=e.shiftKey&&e.target===r[0];if(f||u)return setTimeout(function(){if(r){var t=r[u===!0?r.length-1:0];t&&t.focus()}},10),!1}};return o.position(),o.style(),o.jqif.click(p),r.resize({animate:!1},function(){o.position()}),o.jqi.find("."+s.prefix+"close").click(o.close),o.jqib.on("keydown",d).on("impromptu:loaded",s.loaded).on("impromptu:close",s.close).on("impromptu:statechanging",s.statechanging).on("impromptu:statechanged",s.statechanged),o.jqif[s.show](s.overlayspeed),o.jqi[s.show](s.promptspeed,function(){var t=o.jqi.find("."+s.prefix+"states ."+s.prefix+"state").eq(0);o.goToState(t.data("jqi-name")),o.jqib.trigger("impromptu:loaded")}),s.timeout>0&&(o.timeout=setTimeout(function(){o.close(!0)},s.timeout)),o},close:function(e,i,n,o){var s=this;return s.timeout&&(clearTimeout(s.timeout),s.timeout=!1),s.jqib&&s.jqib.fadeOut("fast",function(){s.jqib.trigger("impromptu:close",[i,n,o]),s.jqib.remove(),t(window).off("resize",function(){s.position()}),"function"==typeof e&&e()}),s.currentStateName="",s},addState:function(i,n,o){var s,a,r,f,u,l=this,p="",d=null,c="",m="",h=l.options,v=t("."+h.prefix+"states"),g=[],x=0;if(n=t.extend({},e.defaults.state,{name:i},n),null!==n.position.arrow&&(c='<div class="'+h.prefix+"arrow "+h.prefix+"arrow"+n.position.arrow+'"></div>'),n.title&&""!==n.title&&(m='<div class="lead '+h.prefix+"title "+h.classes.title+'">'+n.title+"</div>"),s=n.html,"function"==typeof n.html&&(s="Error: html function must return text"),p+='<div id="'+h.prefix+"state_"+i+'" class="'+h.prefix+'state" data-jqi-name="'+i+'" style="display:none;">'+c+m+'<div class="'+h.prefix+"message "+h.classes.message+'">'+s+"</div>"+'<div class="'+h.prefix+"buttons "+h.classes.buttons+'"'+(t.isEmptyObject(n.buttons)?'style="display:none;"':"")+">",t.isArray(n.buttons))g=n.buttons;else if(t.isPlainObject(n.buttons))for(r in n.buttons)n.buttons.hasOwnProperty(r)&&g.push({title:r,value:n.buttons[r]});for(x=0,u=g.length;u>x;x++)f=g[x],a=n.focus===x||isNaN(n.focus)&&n.defaultButton===x?h.prefix+"defaultbutton "+h.classes.defaultButton:"",p+='<button class="'+h.classes.button+" "+h.prefix+"button "+a,f.classes!==void 0&&(p+=" "+(t.isArray(f.classes)?f.classes.join(" "):f.classes)+" "),p+='" name="'+h.prefix+"_"+i+"_button"+f.title.replace(/[^a-z0-9]+/gi,"")+'" id="'+h.prefix+"_"+i+"_button"+f.title.replace(/[^a-z0-9]+/gi,"")+'" value="'+f.value+'">'+f.title+"</button>";return p+="</div></div>",d=t(p),d.on("impromptu:submit",n.submit),void 0!==o?v.find('[data-jqi-name="'+o+'"]').after(d):v.append(d),l.options.states[i]=n,d},removeState:function(t,e){var i=this,n=i.getState(t),o=function(){n.remove()};return 0===n.length?!1:("none"!==n.css("display")?void 0!==e&&i.getState(e).length>0?i.goToState(e,!1,o):n.next().length>0?i.nextState(o):n.prev().length>0?i.prevState(o):i.close():n.slideUp("slow",o),!0)},getPrompt:function(){return this.jqi},getState:function(t){return this.jqi.find('[data-jqi-name="'+t+'"]')},getCurrentState:function(){return this.getState(this.getCurrentStateName())},getCurrentStateName:function(){return this.currentStateName},position:function(e){var i=this,n=t.fx.off,o=i.getCurrentState(),s=i.options.states[o.data("jqi-name")],a=s?s.position:void 0,r=t(window),f=document.body.scrollHeight,u=t(window).height(),l=(t(document).height(),f>u?f:u),p=parseInt(r.scrollTop(),10)+((""+i.options.top).indexOf("%")>=0?u*(parseInt(i.options.top,10)/100):parseInt(i.options.top,10));if(void 0!==e&&e.data.animate===!1&&(t.fx.off=!0),i.jqib.css({position:"absolute",height:l,width:"100%",top:0,left:0,right:0,bottom:0}),i.jqif.css({position:"fixed",height:l,width:"100%",top:0,left:0,right:0,bottom:0}),a&&a.container){var d=t(a.container).offset();t.isPlainObject(d)&&void 0!==d.top&&(i.jqi.css({position:"absolute"}),i.jqi.animate({top:d.top+a.y,left:d.left+a.x,marginLeft:0,width:void 0!==a.width?a.width:null}),p=d.top+a.y-((""+i.options.top).indexOf("%")>=0?u*(parseInt(i.options.top,10)/100):parseInt(i.options.top,10)),t("html,body").animate({scrollTop:p},"slow","swing",function(){}))}else a&&a.width?(i.jqi.css({position:"absolute",left:"50%"}),i.jqi.animate({top:a.y||p,left:a.x||"50%",marginLeft:-1*(a.width/2),width:a.width})):i.jqi.css({position:"absolute",top:p,left:"50%",marginLeft:-1*(i.jqi.outerWidth(!1)/2)});void 0!==e&&e.data.animate===!1&&(t.fx.off=n)},style:function(){var t=this;t.jqif.css({zIndex:t.options.zIndex,display:"none",opacity:t.options.opacity}),t.jqi.css({zIndex:t.options.zIndex+1,display:"none"}),t.jqib.css({zIndex:t.options.zIndex})},goToState:function(e,i,n){var o=this,s=(o.jqi,o.options),a=o.getState(e),r=s.states[a.data("jqi-name")],f=new t.Event("impromptu:statechanging"),u=o.options;if(void 0!==r){if("function"==typeof r.html){var l=r.html;a.find("."+u.prefix+"message ").html(l())}"function"==typeof i&&(n=i,i=!1),o.jqib.trigger(f,[o.getCurrentStateName(),e]),!f.isDefaultPrevented()&&a.length>0&&(o.jqi.find("."+u.prefix+"parentstate").removeClass(u.prefix+"parentstate"),i?(o.jqi.find("."+u.prefix+"substate").not(a).slideUp(s.promptspeed).removeClass("."+u.prefix+"substate").find("."+u.prefix+"arrow").hide(),o.jqi.find("."+u.prefix+"state:visible").addClass(u.prefix+"parentstate"),a.addClass(u.prefix+"substate")):o.jqi.find("."+u.prefix+"state").not(a).slideUp(s.promptspeed).find("."+u.prefix+"arrow").hide(),o.currentStateName=r.name,a.slideDown(s.promptspeed,function(){var i=t(this);"string"==typeof r.focus?i.find(r.focus).eq(0).focus():i.find("."+u.prefix+"defaultbutton").focus(),i.find("."+u.prefix+"arrow").show(s.promptspeed),"function"==typeof n&&o.jqib.on("impromptu:statechanged",n),o.jqib.trigger("impromptu:statechanged",[e]),"function"==typeof n&&o.jqib.off("impromptu:statechanged",n)}),i||o.position())}return a},nextState:function(t){var e=this,i=e.getCurrentState().next();return i.length>0&&e.goToState(i.data("jqi-name"),t),i},prevState:function(t){var e=this,i=e.getCurrentState().prev();return i.length>0&&e.goToState(i.data("jqi-name"),t),i}},t.fn.prompt=function(i){void 0===i&&(i={}),void 0===i.withDataAndEvents&&(i.withDataAndEvents=!1),new e(t(this).clone(i.withDataAndEvents).html(),i)},window.Impromptu=e,t.prompt=new e});
\ No newline at end of file
+(function(t,e){"function"==typeof define&&define.amd?define(["jquery"],e):e(t.jQuery)})(this,function(t){"use strict";var e=function(t,e){return t&&this.open(t,e),this};e.defaults={prefix:"jqi",classes:{box:"",fade:"",prompt:"",form:"",close:"",title:"",message:"",buttons:"",button:"",defaultButton:""},title:"",closeText:"&times;",buttons:{Ok:!0},loaded:function(){},submit:function(){},close:function(){},statechanging:function(){},statechanged:function(){},opacity:.6,zIndex:999,overlayspeed:"slow",promptspeed:"fast",show:"fadeIn",focus:0,defaultButton:0,useiframe:!1,top:"15%",position:{container:null,x:null,y:null,arrow:null,width:null},persistent:!0,timeout:0,states:{},state:{name:null,title:"",html:"",buttons:{Ok:!0},focus:0,defaultButton:0,position:{container:null,x:null,y:null,arrow:null,width:null},submit:function(){return!0}}},e.setDefaults=function(i){e.defaults=t.extend({},e.defaults,i)},e.setStateDefaults=function(i){e.defaults.state=t.extend({},e.defaults.state,i)},e.prototype={open:function(i,n){var o=this;o.options=t.extend({},e.defaults,n),o.timeout&&clearTimeout(o.timeout),o.timeout=!1;var s=o.options,a=t(document.body),r=t(window),f='<div class="'+s.prefix+"box "+s.classes.box+'">';f+=s.useiframe&&t("object, applet").length>0?'<iframe src="javascript:false;" style="display:block;position:absolute;z-index:-1;" class="'+s.prefix+"fade "+s.classes.fade+'"></iframe>':'<div class="'+s.prefix+"fade "+s.classes.fade+'"></div>',f+='<div class="'+s.prefix+" "+s.classes.prompt+'">'+'<form action="javascript:false;" onsubmit="return false;" class="'+s.prefix+"form "+s.classes.form+'">'+'<div class="'+s.prefix+"close "+s.classes.close+'">'+s.closeText+"</div>"+'<div class="'+s.prefix+'states"></div>'+"</form>"+"</div>"+"</div>",o.jqib=t(f).appendTo(a),o.jqi=o.jqib.children("."+s.prefix),o.jqif=o.jqib.children("."+s.prefix+"fade"),i.constructor===String&&(i={state0:{title:s.title,html:i,buttons:s.buttons,position:s.position,focus:s.focus,defaultButton:s.defaultButton,submit:s.submit}}),o.options.states={};var u,l;for(u in i)l=t.extend({},e.defaults.state,{name:u},i[u]),o.addState(l.name,l),""===o.currentStateName&&(o.currentStateName=l.name);o.jqi.on("click","."+s.prefix+"buttons button",function(){var e=t(this),i=e.parents("."+s.prefix+"state"),n=o.options.states[i.data("jqi-name")],a=i.children("."+s.prefix+"message"),r=n.buttons[e.text()]||n.buttons[e.html()],f={};if(void 0===r)for(var u in n.buttons)(n.buttons[u].title===e.text()||n.buttons[u].title===e.html())&&(r=n.buttons[u].value);t.each(o.jqi.children("form").serializeArray(),function(t,e){void 0===f[e.name]?f[e.name]=e.value:typeof f[e.name]===Array||"object"==typeof f[e.name]?f[e.name].push(e.value):f[e.name]=[f[e.name],e.value]});var l=new t.Event("impromptu:submit");l.stateName=n.name,l.state=i,i.trigger(l,[r,a,f]),l.isDefaultPrevented()||o.close(!0,r,a,f)});var p=function(){if(s.persistent){var e=(""+s.top).indexOf("%")>=0?r.height()*(parseInt(s.top,10)/100):parseInt(s.top,10),i=parseInt(o.jqi.css("top").replace("px",""),10)-e;t("html,body").animate({scrollTop:i},"fast",function(){var t=0;o.jqib.addClass(s.prefix+"warning");var e=setInterval(function(){o.jqib.toggleClass(s.prefix+"warning"),t++>1&&(clearInterval(e),o.jqib.removeClass(s.prefix+"warning"))},100)})}else o.close(!0)},d=function(e){var i=window.event?event.keyCode:e.keyCode;if(27===i&&p(),13===i){var n=o.getCurrentState().find("."+s.prefix+"defaultbutton"),a=t(e.target);a.is("textarea,."+s.prefix+"button")===!1&&n.length>0&&(e.preventDefault(),n.click())}if(9===i){var r=t("input,select,textarea,button",o.getCurrentState()),f=!e.shiftKey&&e.target===r[r.length-1],u=e.shiftKey&&e.target===r[0];if(f||u)return setTimeout(function(){if(r){var t=r[u===!0?r.length-1:0];t&&t.focus()}},10),!1}};return o.position(),o.style(),o.jqif.click(p),r.resize({animate:!1},function(){o.position()}),o.jqi.find("."+s.prefix+"close").click(function(){o.close()}),o.jqib.on("keydown",d).on("impromptu:loaded",s.loaded).on("impromptu:close",s.close).on("impromptu:statechanging",s.statechanging).on("impromptu:statechanged",s.statechanged),o.jqif[s.show](s.overlayspeed),o.jqi[s.show](s.promptspeed,function(){var t=o.jqi.find("."+s.prefix+"states ."+s.prefix+"state").eq(0);o.goToState(t.data("jqi-name")),o.jqib.trigger("impromptu:loaded")}),s.timeout>0&&(o.timeout=setTimeout(function(){o.close(!0)},s.timeout)),o},close:function(e,i,n,o){var s=this;return s.timeout&&(clearTimeout(s.timeout),s.timeout=!1),s.jqib&&s.jqib.fadeOut("fast",function(){s.jqib.trigger("impromptu:close",[i,n,o]),s.jqib.remove(),t(window).off("resize",function(){s.position()}),"function"==typeof e&&e()}),s.currentStateName="",s},addState:function(i,n,o){var s,a,r,f,u,l=this,p="",d=null,c="",m="",h=l.options,v=t("."+h.prefix+"states"),g=[],b=0;if(n=t.extend({},e.defaults.state,{name:i},n),null!==n.position.arrow&&(c='<div class="'+h.prefix+"arrow "+h.prefix+"arrow"+n.position.arrow+'"></div>'),n.title&&""!==n.title&&(m='<div class="lead '+h.prefix+"title "+h.classes.title+'">'+n.title+"</div>"),s=n.html,"function"==typeof n.html&&(s="Error: html function must return text"),p+='<div class="'+h.prefix+'state" data-jqi-name="'+i+'" style="display:none;">'+c+m+'<div class="'+h.prefix+"message "+h.classes.message+'">'+s+"</div>"+'<div class="'+h.prefix+"buttons "+h.classes.buttons+'"'+(t.isEmptyObject(n.buttons)?'style="display:none;"':"")+">",t.isArray(n.buttons))g=n.buttons;else if(t.isPlainObject(n.buttons))for(r in n.buttons)n.buttons.hasOwnProperty(r)&&g.push({title:r,value:n.buttons[r]});for(b=0,u=g.length;u>b;b++)f=g[b],a=n.focus===b||isNaN(n.focus)&&n.defaultButton===b?h.prefix+"defaultbutton "+h.classes.defaultButton:"",p+='<button class="'+h.classes.button+" "+h.prefix+"button "+a,f.classes!==void 0&&(p+=" "+(t.isArray(f.classes)?f.classes.join(" "):f.classes)+" "),p+='" name="'+h.prefix+"_"+i+"_button"+f.title.replace(/[^a-z0-9]+/gi,"")+'" value="'+f.value+'">'+f.title+"</button>";return p+="</div></div>",d=t(p),d.on("impromptu:submit",n.submit),void 0!==o?v.find('[data-jqi-name="'+o+'"]').after(d):v.append(d),l.options.states[i]=n,d},removeState:function(t,e){var i=this,n=i.getState(t),o=function(){n.remove()};return 0===n.length?!1:("none"!==n.css("display")?void 0!==e&&i.getState(e).length>0?i.goToState(e,!1,o):n.next().length>0?i.nextState(o):n.prev().length>0?i.prevState(o):i.close():n.slideUp("slow",o),!0)},getPrompt:function(){return this.jqi},getState:function(t){return this.jqi.find('[data-jqi-name="'+t+'"]')},getCurrentState:function(){return this.getState(this.getCurrentStateName())},getCurrentStateName:function(){return this.currentStateName},position:function(e){var i=this,n=t.fx.off,o=i.getCurrentState(),s=i.options.states[o.data("jqi-name")],a=s?s.position:void 0,r=t(window),f=document.body.scrollHeight,u=t(window).height(),l=(t(document).height(),f>u?f:u),p=parseInt(r.scrollTop(),10)+((""+i.options.top).indexOf("%")>=0?u*(parseInt(i.options.top,10)/100):parseInt(i.options.top,10));if(void 0!==e&&e.data.animate===!1&&(t.fx.off=!0),i.jqib.css({position:"absolute",height:l,width:"100%",top:0,left:0,right:0,bottom:0}),i.jqif.css({position:"fixed",height:l,width:"100%",top:0,left:0,right:0,bottom:0}),a&&a.container){var d=t(a.container).offset();t.isPlainObject(d)&&void 0!==d.top&&(i.jqi.css({position:"absolute"}),i.jqi.animate({top:d.top+a.y,left:d.left+a.x,marginLeft:0,width:void 0!==a.width?a.width:null}),p=d.top+a.y-((""+i.options.top).indexOf("%")>=0?u*(parseInt(i.options.top,10)/100):parseInt(i.options.top,10)),t("html,body").animate({scrollTop:p},"slow","swing",function(){}))}else a&&a.width?(i.jqi.css({position:"absolute",left:"50%"}),i.jqi.animate({top:a.y||p,left:a.x||"50%",marginLeft:-1*(a.width/2),width:a.width})):i.jqi.css({position:"absolute",top:p,left:"50%",marginLeft:-1*(i.jqi.outerWidth(!1)/2)});void 0!==e&&e.data.animate===!1&&(t.fx.off=n)},style:function(){var t=this;t.jqif.css({zIndex:t.options.zIndex,display:"none",opacity:t.options.opacity}),t.jqi.css({zIndex:t.options.zIndex+1,display:"none"}),t.jqib.css({zIndex:t.options.zIndex})},goToState:function(e,i,n){var o=this,s=(o.jqi,o.options),a=o.getState(e),r=s.states[a.data("jqi-name")],f=new t.Event("impromptu:statechanging"),u=o.options;if(void 0!==r){if("function"==typeof r.html){var l=r.html;a.find("."+u.prefix+"message ").html(l())}"function"==typeof i&&(n=i,i=!1),o.jqib.trigger(f,[o.getCurrentStateName(),e]),!f.isDefaultPrevented()&&a.length>0&&(o.jqi.find("."+u.prefix+"parentstate").removeClass(u.prefix+"parentstate"),i?(o.jqi.find("."+u.prefix+"substate").not(a).slideUp(s.promptspeed).removeClass("."+u.prefix+"substate").find("."+u.prefix+"arrow").hide(),o.jqi.find("."+u.prefix+"state:visible").addClass(u.prefix+"parentstate"),a.addClass(u.prefix+"substate")):o.jqi.find("."+u.prefix+"state").not(a).slideUp(s.promptspeed).find("."+u.prefix+"arrow").hide(),o.currentStateName=r.name,a.slideDown(s.promptspeed,function(){var i=t(this);"string"==typeof r.focus?i.find(r.focus).eq(0).focus():i.find("."+u.prefix+"defaultbutton").focus(),i.find("."+u.prefix+"arrow").show(s.promptspeed),"function"==typeof n&&o.jqib.on("impromptu:statechanged",n),o.jqib.trigger("impromptu:statechanged",[e]),"function"==typeof n&&o.jqib.off("impromptu:statechanged",n)}),i||o.position())}return a},nextState:function(t){var e=this,i=e.getCurrentState().next();return i.length>0&&e.goToState(i.data("jqi-name"),t),i},prevState:function(t){var e=this,i=e.getCurrentState().prev();return i.length>0&&e.goToState(i.data("jqi-name"),t),i}},t.fn.prompt=function(i){void 0===i&&(i={}),void 0===i.withDataAndEvents&&(i.withDataAndEvents=!1),new e(t(this).clone(i.withDataAndEvents).html(),i)},window.Impromptu=e,t.prompt=new e});
\ No newline at end of file
diff --git a/src/jquery-impromptu.js b/src/jquery-impromptu.js
index 10f770d..e4af2de 100644
--- a/src/jquery-impromptu.js
+++ b/src/jquery-impromptu.js
@@ -388,7 +388,7 @@
 				showHtml = 'Error: html function must return text';

 			}

 

-			state += '<div id="'+ opts.prefix +'state_'+ statename +'" class="'+ opts.prefix + 'state" data-jqi-name="'+ statename +'" style="display:none;">'+

+			state += '<div class="'+ opts.prefix + 'state" data-jqi-name="'+ statename +'" style="display:none;">'+

 						arrow + title +

 						'<div class="'+ opts.prefix +'message '+ opts.classes.message +'">' + showHtml +'</div>'+

 						'<div class="'+ opts.prefix +'buttons '+ opts.classes.buttons +'"'+ ($.isEmptyObject(stateobj.buttons)? 'style="display:none;"':'') +'>';

@@ -416,7 +416,7 @@
 					state += ' '+ ($.isArray(v.classes)? v.classes.join(' ') : v.classes) + ' ';

 				}

 

-				state += '" name="' + opts.prefix + '_' + statename + '_button' + v.title.replace(/[^a-z0-9]+/gi,'') + '" id="' + opts.prefix + '_' + statename + '_button' + v.title.replace(/[^a-z0-9]+/gi,'') + '" value="' + v.value + '">' + v.title + '</button>';

+				state += '" name="' + opts.prefix + '_' + statename + '_button' + v.title.replace(/[^a-z0-9]+/gi,'') + '" value="' + v.value + '">' + v.title + '</button>';

 			}

 			

 			state += '</div></div>';

diff --git a/test/jquery-impromptu_spec.js b/test/jquery-impromptu_spec.js
index d615424..08e231b 100644
--- a/test/jquery-impromptu_spec.js
+++ b/test/jquery-impromptu_spec.js
@@ -85,8 +85,8 @@ describe('jquery-impromptu', function() {
 				$.prompt.open('This is a test', {
 					buttons: { Ok:true, Cancel:false }
 				});
-				var okBtn = $('#jqi_state0_buttonOk'),
-					cancelBtn = $('#jqi_state0_buttonCancel');
+				var okBtn = $('button[name="jqi_state0_buttonOk"]'),
+					cancelBtn = $('button[name="jqi_state0_buttonCancel"]');
 
 				expect($('.jqibutton')).toHaveLength(2);
 
@@ -108,8 +108,8 @@ describe('jquery-impromptu', function() {
 						{ title: 'Cancel', value: false }
 					]
 				});
-				var okBtn = $('#jqi_state0_buttonOk'),
-					cancelBtn = $('#jqi_state0_buttonCancel');
+				var okBtn = $('button[name="jqi_state0_buttonOk"]'),
+					cancelBtn = $('button[name="jqi_state0_buttonCancel"]');
 
 				expect($('.jqibutton')).toHaveLength(2);
 
@@ -131,8 +131,8 @@ describe('jquery-impromptu', function() {
 						{ title: 'Cancel', value: false, classes: 'cancel1 cancel2' }
 					]
 				});
-				var okBtn = $('#jqi_state0_buttonOk'),
-					cancelBtn = $('#jqi_state0_buttonCancel');
+				var okBtn = $('button[name="jqi_state0_buttonOk"]'),
+					cancelBtn = $('button[name="jqi_state0_buttonCancel"]');
 
 				expect(okBtn).toHaveClass('ok1');
 				expect(okBtn).toHaveClass('ok2');
@@ -150,8 +150,8 @@ describe('jquery-impromptu', function() {
 					],
 					classes: { button: 'testclass' }
 				});
-				var okBtn = $('#jqi_state0_buttonOk'),
-					cancelBtn = $('#jqi_state0_buttonCancel');
+				var okBtn = $('button[name="jqi_state0_buttonOk"]'),
+					cancelBtn = $('button[name="jqi_state0_buttonCancel"]');
 
 				expect(okBtn).toHaveClass('testclass');
 				expect(cancelBtn).toHaveClass('testclass');
@@ -167,9 +167,9 @@ describe('jquery-impromptu', function() {
 					],
 					focus: 1
 				});
-				var okBtn = $('#jqi_state0_buttonOk'),
-					cancelBtn = $('#jqi_state0_buttonCancel'),
-					anotherBtn = $('#jqi_state0_buttonAnother');
+				var okBtn = $('button[name="jqi_state0_buttonOk"]'),
+					cancelBtn = $('button[name="jqi_state0_buttonCancel"]'),
+					anotherBtn = $('button[name="jqi_state0_buttonAnother"]');
 
 				expect(okBtn).not.toHaveClass('jqidefaultbutton');
 				expect(cancelBtn).toHaveClass('jqidefaultbutton');
@@ -187,9 +187,9 @@ describe('jquery-impromptu', function() {
 					focus: '#testInput',
 					defaultButton: 1
 				});
-				var okBtn = $('#jqi_state0_buttonOk'),
-					cancelBtn = $('#jqi_state0_buttonCancel'),
-					anotherBtn = $('#jqi_state0_buttonAnother');
+				var okBtn = $('button[name="jqi_state0_buttonOk"]'),
+					cancelBtn = $('button[name="jqi_state0_buttonCancel"]'),
+					anotherBtn = $('button[name="jqi_state0_buttonAnother"]');
 
 				expect(okBtn).not.toHaveClass('jqidefaultbutton');
 				expect(cancelBtn).toHaveClass('jqidefaultbutton');
@@ -227,9 +227,9 @@ describe('jquery-impromptu', function() {
 				
 				expect($('.jqistate')).toHaveLength(3);
 
-				expect($('#jqistate_s1 .jqimessage')).toHaveText(states.s1.html);
-				expect($('#jqistate_s2 .jqimessage')).toHaveText(states.s2.html);
-				expect($('#jqistate_s3 .jqimessage')).toHaveText(states.s3.html);
+				expect($('.jqistate[data-jqi-name="s1"] .jqimessage')).toHaveText(states.s1.html);
+				expect($('.jqistate[data-jqi-name="s2"] .jqimessage')).toHaveText(states.s2.html);
+				expect($('.jqistate[data-jqi-name="s3"] .jqimessage')).toHaveText(states.s3.html);
 			});
 
 			it('should create states from array', function() {
@@ -243,9 +243,9 @@ describe('jquery-impromptu', function() {
 				
 				expect($('.jqistate')).toHaveLength(3);
 
-				expect($('#jqistate_0 .jqimessage')).toHaveText(states[0].html);
-				expect($('#jqistate_1 .jqimessage')).toHaveText(states[1].html);
-				expect($('#jqistate_2 .jqimessage')).toHaveText(states[2].html);
+				expect($('.jqistate[data-jqi-name="0"] .jqimessage')).toHaveText(states[0].html);
+				expect($('.jqistate[data-jqi-name="1"] .jqimessage')).toHaveText(states[1].html);
+				expect($('.jqistate[data-jqi-name="2"] .jqimessage')).toHaveText(states[2].html);
 			});
 
 			it('should show the first state automatically', function() {
@@ -259,9 +259,9 @@ describe('jquery-impromptu', function() {
 
 				$.prompt.open(states);
 
-				expect($('#jqistate_0')).toHaveCss({display:'block'});
-				expect($('#jqistate_1')).toHaveCss({display:'none'});
-				expect($('#jqistate_2')).toHaveCss({display:'none'});
+				expect($('.jqistate[data-jqi-name="0"]')).toHaveCss({display:'block'});
+				expect($('.jqistate[data-jqi-name="1"]')).toHaveCss({display:'none'});
+				expect($('.jqistate[data-jqi-name="2"]')).toHaveCss({display:'none'});
 			});
 
 			it('should name states properly when name specified', function() {
@@ -273,9 +273,9 @@ describe('jquery-impromptu', function() {
 
 				$.prompt.open(states);
 				
-				expect($('#jqistate_s1')).toExist();
-				expect($('#jqistate_s2')).toExist();
-				expect($('#jqistate_s3')).toExist();
+				expect($('.jqistate[data-jqi-name="s1"]')).toExist();
+				expect($('.jqistate[data-jqi-name="s2"]')).toExist();
+				expect($('.jqistate[data-jqi-name="s3"]')).toExist();
 			});
 		});
 
@@ -354,7 +354,7 @@ describe('jquery-impromptu', function() {
 					$.prompt.open(states);
 					
 					var actualResult = $.prompt.getState('s2'),
-						expectedResult = $('#jqistate_s2');
+						expectedResult = $('.jqistate[data-jqi-name="s2"]');
 
 					expect(actualResult[0]).toBe(expectedResult[0]);
 				});
@@ -367,7 +367,7 @@ describe('jquery-impromptu', function() {
 					$.prompt.open(states);
 					
 					var actualResult = $.prompt.getCurrentState(),
-						expectedResult = $('#jqistate_s1');
+						expectedResult = $('.jqistate[data-jqi-name="s1"]');
 
 					expect(actualResult[0]).toBe(expectedResult[0]);
 				});
@@ -377,7 +377,7 @@ describe('jquery-impromptu', function() {
 					$.prompt.open(states);
 					$.prompt.goToState('s2');
 					var actualResult = $.prompt.getCurrentState(),
-						expectedResult = $('#jqistate_s2');
+						expectedResult = $('.jqistate[data-jqi-name="s2"]');
 
 					expect(actualResult[0]).toBe(expectedResult[0]);
 				});
@@ -414,9 +414,9 @@ describe('jquery-impromptu', function() {
 					
 					$.prompt.goToState('s3');
 
-					expect($('#jqistate_s1')).toHaveCss({display:'none'});
-					expect($('#jqistate_s2')).toHaveCss({display:'none'});
-					expect($('#jqistate_s3')).toHaveCss({display:'block'});
+					expect($('.jqistate[data-jqi-name="s1"]')).toHaveCss({display:'none'});
+					expect($('.jqistate[data-jqi-name="s2"]')).toHaveCss({display:'none'});
+					expect($('.jqistate[data-jqi-name="s3"]')).toHaveCss({display:'block'});
 				});
 
 				it('should do nothing if the state is not available', function() {
@@ -425,9 +425,9 @@ describe('jquery-impromptu', function() {
 					
 					$.prompt.goToState('s4');
 
-					expect($('#jqistate_s1')).toHaveCss({display:'block'});
-					expect($('#jqistate_s2')).toHaveCss({display:'none'});
-					expect($('#jqistate_s3')).toHaveCss({display:'none'});
+					expect($('.jqistate[data-jqi-name="s1"]')).toHaveCss({display:'block'});
+					expect($('.jqistate[data-jqi-name="s2"]')).toHaveCss({display:'none'});
+					expect($('.jqistate[data-jqi-name="s3"]')).toHaveCss({display:'none'});
 				});
 
 				it('should handle substate option', function() {
@@ -436,11 +436,11 @@ describe('jquery-impromptu', function() {
 					
 					$.prompt.goToState('s2',true);
 
-					expect($('#jqistate_s1')).toHaveCss({display:'block'});
-					expect($('#jqistate_s2')).toHaveCss({display:'block'});
-					expect($('#jqistate_s3')).toHaveCss({display:'none'});
+					expect($('.jqistate[data-jqi-name="s1"]')).toHaveCss({display:'block'});
+					expect($('.jqistate[data-jqi-name="s2"]')).toHaveCss({display:'block'});
+					expect($('.jqistate[data-jqi-name="s3"]')).toHaveCss({display:'none'});
 
-					expect($('#jqistate_s2')).toHaveClass('jqisubstate');
+					expect($('.jqistate[data-jqi-name="s2"]')).toHaveClass('jqisubstate');
 				});
 			});
 
@@ -452,9 +452,9 @@ describe('jquery-impromptu', function() {
 					
 					$.prompt.nextState();
 
-					expect($('#jqistate_s1')).toHaveCss({display:'none'});
-					expect($('#jqistate_s2')).toHaveCss({display:'block'});
-					expect($('#jqistate_s3')).toHaveCss({display:'none'});
+					expect($('.jqistate[data-jqi-name="s1"]')).toHaveCss({display:'none'});
+					expect($('.jqistate[data-jqi-name="s2"]')).toHaveCss({display:'block'});
+					expect($('.jqistate[data-jqi-name="s3"]')).toHaveCss({display:'none'});
 				});
 
 				it('should do nothing if the state is not available', function() {
@@ -464,9 +464,9 @@ describe('jquery-impromptu', function() {
 					$.prompt.goToState('s3');
 					$.prompt.nextState();
 
-					expect($('#jqistate_s1')).toHaveCss({display:'none'});
-					expect($('#jqistate_s2')).toHaveCss({display:'none'});
-					expect($('#jqistate_s3')).toHaveCss({display:'block'});
+					expect($('.jqistate[data-jqi-name="s1"]')).toHaveCss({display:'none'});
+					expect($('.jqistate[data-jqi-name="s2"]')).toHaveCss({display:'none'});
+					expect($('.jqistate[data-jqi-name="s3"]')).toHaveCss({display:'block'});
 				});
 			});
 
@@ -479,9 +479,9 @@ describe('jquery-impromptu', function() {
 					$.prompt.goToState('s3');
 					$.prompt.prevState();
 
-					expect($('#jqistate_s1')).toHaveCss({display:'none'});
-					expect($('#jqistate_s2')).toHaveCss({display:'block'});
-					expect($('#jqistate_s3')).toHaveCss({display:'none'});
+					expect($('.jqistate[data-jqi-name="s1"]')).toHaveCss({display:'none'});
+					expect($('.jqistate[data-jqi-name="s2"]')).toHaveCss({display:'block'});
+					expect($('.jqistate[data-jqi-name="s3"]')).toHaveCss({display:'none'});
 				});
 
 				it('should do nothing if the state is not available', function() {
@@ -490,9 +490,9 @@ describe('jquery-impromptu', function() {
 					
 					$.prompt.prevState();
 
-					expect($('#jqistate_s1')).toHaveCss({display:'block'});
-					expect($('#jqistate_s2')).toHaveCss({display:'none'});
-					expect($('#jqistate_s3')).toHaveCss({display:'none'});
+					expect($('.jqistate[data-jqi-name="s1"]')).toHaveCss({display:'block'});
+					expect($('.jqistate[data-jqi-name="s2"]')).toHaveCss({display:'none'});
+					expect($('.jqistate[data-jqi-name="s3"]')).toHaveCss({display:'none'});
 				});
 			});
 
@@ -514,10 +514,10 @@ describe('jquery-impromptu', function() {
 					expect($stateobj).toExist();
 
 					// element in the right place?
-					expect($stateobj.prev()).toHaveId('jqistate_s3');
+					expect($stateobj.prev().data('jqi-name')).toBe('s3');
 
 					// element visibility correct?
-					expect($('#jqistate_s1')).toHaveCss({display:'block'});
+					expect($('.jqistate[data-jqi-name="s1"]')).toHaveCss({display:'block'});
 					expect($stateobj).toHaveCss({display:'none'});
 
 					// content generated ok?
@@ -539,7 +539,7 @@ describe('jquery-impromptu', function() {
 					
 					var $stateobj = $.prompt.addState(newState.name, newState, afterState);
 
-					expect($stateobj.prev()).toHaveId('jqistate_'+afterState);
+					expect($stateobj.prev().data('jqi-name')).toBe(afterState);
 				});
 			});
 
@@ -551,7 +551,7 @@ describe('jquery-impromptu', function() {
 					
 					$.prompt.removeState('s2');
 
-					expect($('#jqistate_s2')).not.toExist();
+					expect($('.jqistate[data-jqi-name="s2"]')).not.toExist();
 				});
 				
 				it('should display requested state', function() {
@@ -560,8 +560,8 @@ describe('jquery-impromptu', function() {
 					
 					$.prompt.removeState('s1','s3');
 
-					expect($('#jqistate_s2')).toHaveCss({display:'none'});
-					expect($('#jqistate_s3')).toHaveCss({display:'block'});
+					expect($('.jqistate[data-jqi-name="s2"]')).toHaveCss({display:'none'});
+					expect($('.jqistate[data-jqi-name="s3"]')).toHaveCss({display:'block'});
 				});
 				
 				it('should display next state', function() {
@@ -570,8 +570,8 @@ describe('jquery-impromptu', function() {
 					
 					$.prompt.removeState('s1');
 
-					expect($('#jqistate_s2')).toHaveCss({display:'block'});
-					expect($('#jqistate_s3')).toHaveCss({display:'none'});
+					expect($('.jqistate[data-jqi-name="s2"]')).toHaveCss({display:'block'});
+					expect($('.jqistate[data-jqi-name="s3"]')).toHaveCss({display:'none'});
 				});
 				
 				it('should display previous state', function() {
@@ -580,8 +580,8 @@ describe('jquery-impromptu', function() {
 					$.prompt.goToState('s3');
 					$.prompt.removeState('s3');
 
-					expect($('#jqistate_s1')).toHaveCss({display:'none'});
-					expect($('#jqistate_s2')).toHaveCss({display:'block'});
+					expect($('.jqistate[data-jqi-name="s1"]')).toHaveCss({display:'none'});
+					expect($('.jqistate[data-jqi-name="s2"]')).toHaveCss({display:'block'});
 				});
 				
 			});
@@ -851,7 +851,7 @@ describe('jquery-impromptu', function() {
 
 					$.prompt.open(states, {
 						loaded: function(){
-							$.prompt.getState('s1').find('#jqi_s1_buttoncancel').click();
+							$.prompt.getState('s1').find('button[value="false"]').click();
 						}
 					});
 				});
@@ -903,7 +903,7 @@ describe('jquery-impromptu', function() {
 
 					$.prompt.open(tmpStates, {
 						loaded: function(){
-							$.prompt.getState('s1').find('#jqi_s1_buttonnext').click();
+							$.prompt.getState('s1').find('button[value="true"]').click();
 						}
 					});
 				});