I have used fancybox and appended a text div content to every images. The text div content appended is working well.But as I click to next button, the text div content is appended twice for each images.How to append that div content only once ?
$('.proBox').fancybox({
thumbs : {
autoStart : true,
axis : 'x'
},
idleTime : 0,
buttons : [
'info', 'close','thumbs'
],
afterShow: function( instance, current ) {
var url = window.location.href;
var cat = url.substring(url.lastIndexOf('#') + 1);
var cats = cat.split('-');
catId= cats[0];
var toolbar = "<div id='tools'>"+$('#addscetion div').eq(this.index).html()+ "</div>";
var index=catId+$("[data-fancybox-index]").html();
$('.fancybox-slide').children(".imagecontainer").remove();
// This is the div content that I am appending
$(".fancybox-slide").append(toolbar);
$(".fancybox-slide").append($('#'+index).html());
},
caption : function( instance, obj ) {
return '<div><p class="fancy-nav"><a data-fancybox-prev title="Previous" tabindex="1">‹</a> <a data-fancybox-next title="Next" tabindex="2">›</a> <span data-fancybox-index></span> of <span data-fancybox-count></span> images</p>' + $(this).find('.caption').html() + '</div>';
},
onInit: function(instance) {
instance.$refs.container.on('touchstart', '[data-fancybox-info]', function(e) {
e.stopPropagation();
e.preventDefault();
instance.$refs.container.toggleClass('fancybox-vertical-caption');
});
instance.$refs.container.on('mouseenter', '[data-fancybox-info]', function(e) {
instance.$refs.container.addClass('fancybox-vertical-caption');
instance.$refs.caption.one('mouseleave', function(e) {
instance.$refs.container.removeClass('fancybox-vertical-caption');
});
});
instance.$refs.container.on('click', '[data-fancybox-captionimg]', function(e) {
$(".fancybox-image").attr("src",this.src);
});
instance.$refs.container.on('click', '[data-fancybox-captionbtn]', function(e) {
$('.fancyRightCont').slideToggle('slow');
});
}
});
You can first remove appended html data from .fancybox-slide and then after append HTML like this
$(".fancybox-slide").html('');
$(".fancybox-slide").append(toolbar);
$(".fancybox-slide").append($('#' + index).html());
Try below code.
$('.proBox').fancybox({
thumbs: {
autoStart: true,
axis: 'x'
},
idleTime: 0,
buttons: [
'info', 'close', 'thumbs'
],
afterShow: function(instance, current) {
var url = window.location.href;
var cat = url.substring(url.lastIndexOf('#') + 1);
var cats = cat.split('-');
catId = cats[0];
var toolbar = "<div id='tools'>" + $('#addscetion div').eq(this.index).html() + "</div>";
var index = catId + $("[data-fancybox-index]").html();
$('.fancybox-slide').children(".imagecontainer").remove();
// This is the div content that I am appending
$(".fancybox-slide").html('');
$(".fancybox-slide").append(toolbar);
$(".fancybox-slide").append($('#' + index).html());
},
caption: function(instance, obj) {
return '<div><p class="fancy-nav"><a data-fancybox-prev title="Previous" tabindex="1">‹</a> <a data-fancybox-next title="Next" tabindex="2">›</a> <span data-fancybox-index></span> of <span data-fancybox-count></span> images</p>' + $(this).find('.caption').html() + '</div>';
},
onInit: function(instance) {
instance.$refs.container.on('touchstart', '[data-fancybox-info]', function(e) {
e.stopPropagation();
e.preventDefault();
instance.$refs.container.toggleClass('fancybox-vertical-caption');
});
instance.$refs.container.on('mouseenter', '[data-fancybox-info]', function(e) {
instance.$refs.container.addClass('fancybox-vertical-caption');
instance.$refs.caption.one('mouseleave', function(e) {
instance.$refs.container.removeClass('fancybox-vertical-caption');
});
});
instance.$refs.container.on('click', '[data-fancybox-captionimg]', function(e) {
$(".fancybox-image").attr("src", this.src);
});
instance.$refs.container.on('click', '[data-fancybox-captionbtn]', function(e) {
$('.fancyRightCont').slideToggle('slow');
});
}
});
Related
I have a log in button that when a user clicks on it a terms and condition dialog pops up and overlaps the contents on a page as follows
TermsSuccess: function (result, context) {
var topTerms = findSetByInArray(result.Data, 'ParentId', 0);
var termsHTML = '<div id="terms"><ul class="termsList">';
for (var i = 0; i < topTerms.length; i++) {
var cls = (topTerms[i].isNew) ? 'newTerm' : 'Term';
termsHTML += '<li id=' + topTerms[i].ID + ' class=' + cls + '>'
termsHTML += topTerms[i].PageIndex + '. ' + topTerms[i].Detail;
termsHTML += getChildrenTerms(result.Data, topTerms[i].ID, topTerms[i].PageIndex + '. ');
termsHTML += '</li>';
}
termsHTML += '</ul></div>';
$(termsHTML).dialog({
modal: true,
resizable: false,
width: 400,
height: 600,
closeOnEscape: false,
open: function (event, ui) {
$(this).parent().children().children('.ui-dialog-titlebar-close').hide();
},
title: "Terms & Conditions",
buttons: [{
text: "Decline",
"class": 'btnDialog',
click: function () {
$(this).dialog("close");
}
},
{
text: "Accept",
"class": 'btnDialog',
click: function () {
betEvents.btnAccept_onClick();
$(this).dialog("close");
}
}]
});
}
I want this dialog to be appended to the following div on the page instead of it poping up over all the contents
<div id="mainarea"></div>
i tried to do something as the following but it doesnt work
function onClick(){
if $("#btnLogin").click(function(){
$('termsHTML').append('#mainarea');
});
}
your guidance will be appreciated.
Change this line:
$('termsHTML').append('#mainarea');
to
$(#mainarea).append(termsHTML);
and try again.
Explanation: $('termsHTML').append('#mainarea'); // here your selector is wrong
HTML
<body>
<section class="main-content">
</section>
</body>
JS
$(document).ready(function() {
var observer = new MutationObserver(function(mutations) {
console.log(mutations);
$.each(mutations, function(k, v) {
$.each(v.addedNodes, function(k2, v2) {
$('div.alert', v2[0]).each(function() {
$alert = $(this);
setTimeout(function() {
$alert.fadeOut(1000);
}, 2000);
});
});
})
});
observer.observe(document, {attributes: false, childList: true, characterData: false, subtree:true});
$('section.main-content').prepend(
createAlert({
type: 'success',
content: 'success'
})
).prepend(
createAlert({
type: 'warning',
content: 'warning'
})
);
});
function createAlert(alert) {
var alert_default = {
type: 'primary',
content: 'Content'
}
var alert = $.extend(alert_default, alert);
return (
'<div class="alert alert-' + alert.type + ' alert-dismissible fade show" role="alert">' +
'<button type="button" class="close" data-dismiss="alert" aria-label="Close">' +
'<span aria-hidden="true">×</span>' +
'</button>' +
alert.content +
'</div>'
);
}
The code shoudld fadeOut all inserted <div class"alert"> even if they are inserted at the same time. but it just doesn't work properly, only the last div.alert that fadeOut.
Here is the https://jsfiddle.net/u58xezqv/
thanks for helping!
Pass the jQuery object to setTimeout() for $alert to reference the same element, also inner nested $.each() is not necessary
var observer = new MutationObserver(function(mutations) {
console.log(mutations);
$.each(mutations, function(k, v) {
console.log(v);
$.each(v.addedNodes, function(k2, v2) {
var $alert = $(v2);
setTimeout(function(el) {
el.fadeOut(1000);
}, 2000, $alert);
});
})
});
jsfiddle https://jsfiddle.net/u58xezqv/3/
In the users tab there are some rows having check boxes. So if more than 2 check boxes are selected then a button named group appears.
Now when group button is clicked then then it will ask for a name and after pressing the ok button on the right side in the group table a group is created. For example select 1st and last row and click the group button. A dialog box appears asking to enter name. Enter test in the input field, after that in the right side group table test appears(please see the screenshot).
Now my question: is if I click the test(group name) now then on the left side the checkboxes will be selected. So in my case 1st check box and last check box will be selected. Please tell me how to do this. This is the fiddle
The js codes are as follows
$(function() {
$("#datetimepicker").datetimepicker({
format: "'dd/MM/yyyy hh:mm:ss'",
linkField: "#txt",
linkFormat: "yyyy-mm-dd hh:ii",
autoclose: true,
});
jQuery('#datetimepicker').datetimepicker().on('changeDate', function(ev){
$(".darea1").val($( ".darea1" ).val()+$( "#txt" ).val());
});
});
$('#tabAll').click(function(){
$('#tabAll').addClass('active');
$('.tab-pane').each(function(i,t){
$('#myTabs li').removeClass('active');
$(this).addClass('active');
});
});
$('body').on('click', '.btn', function(){
if(this.id=='openAlert') {
$('#number').val('');}else{$('#number').val(this.id);
}
});
$(document).ready(function(){
$("#signout").click(function() {
window.location.replace("logout.jsp");
});
//next line
/*var val=0;
$(document).ready(function(){
$('#btn1').click(function(){
if($(".span4").val()!="")
{
$("#mytable").append('<tr id="mytr'+val+'"></tr>');
$("#mytr"+val).append('<td class=\"cb\"><input type=\"checkbox\" value=\"yes\" name="mytr'+val+'" checked ></td>');
$(".span4").each(function () {
$("#mytr"+val).append("<td >"+$(this).val()+"</td>");
});
val++;
}
else
{
alert("please fill the form completely");
}
});
$('#btn2').click(function(){
var creat_group=confirm("Do you want to creat a group??");
if(val>1){
alert(creat_group);
}
});
});*/
var val = 0;
var groupTrCount = 0;
$(document).ready(function () {
var obj={};
$('#btn1').click(function () {
if ($(".span4").val() != "") {
$("#mytable").append('<tr id="mytr' + val + '"></tr>');
$tr=$("#mytr" + val);
$tr.append('<td class=\"cb\"><input type=\"checkbox\" value=\"yes\" name="mytr' + val + '" unchecked ></td>');
$(".span4").each(function () {
$tr.append("<td >" + $(this).val() + "</td>");
});
var arr={};
name=($tr.find('td:eq(1)').text());
email=($tr.find('td:eq(2)').text());
mobile=($tr.find('td:eq(3)').text());
arr['name']=name;arr['email']=email;arr['mobile']=mobile;
obj[val]=arr;
val++;
} else {
alert("please fill the form completely");
}
});
$(document).on('click', '#btn2',function () {
var email=new Array();
var username=new Array();
var mobno=new Array();
var grpname;
var creat_group = prompt("Name your group??");
grpname=creat_group;
if (creat_group) {
console.log(obj);
$("#groupTable").append('<tr id="groupTr' + groupTrCount + '"></tr>');
$tr=$("#groupTr" + groupTrCount);
$tr.append("<td >" + creat_group + "</td>");
$('#mytable tr').filter(':has(:checkbox:checked)').each(function() {
var count=0;
var arrid=0;
$(this).find('td').each(function() {
//your ajax call goes here
if(count == 1){
username[arrid]=$(this).html();
}
if(count==2)
{
email[arrid]=$(this).html();
}
if(count==3)
{
mobno[arrid]=$(this).html();
}
count++;
});
arrid++;
});
$.ajax(
{
type: "POST",
url: "messageSending.jsp", //Your full URL goes here
data: { username: username, email: email,mobno:mobno,grpname:grpname},
success: function(data, textStatus, jqXHR){
alert(data);
},
error: function(jqXHR){
alert(jqXHR.responseStatus);
}
});
groupTrCount++;
}
});
$(document).on('change','#mytable input:checkbox',function () {
if(!this.checked)
{
key=$(this).attr('name').replace('mytr','');
alert(key);
obj[key]=null;
}
//show group
if($('#mytable input:checkbox:checked').length > 1) {
$('#btn2').removeClass('hide')
}
else {
$('#btn2').addClass('hide')
}
//
});
});
//
$('#openAlert').click(function(){
var number = $('#number').val(); // If its a text input could use .text()
var msg = $('#darea').val(); //If its a text input could use .text()
alert(msg);
$.ajax(
{
type: "POST",
url: "messageSending.jsp", //Your full URL goes here
data: { toNumber: number, body: msg},
success: function(data, textStatus, jqXHR){
alert(data);
},
error: function(jqXHR){
alert(jqXHR.responseStatus);
}
});
});
});
$(function ()
{ $("#number").popover({title: 'Enter Mobile Number',content: "Please enter 10 digit mobile number prefixed by country code eg +911234567890"});
});
$(function ()
{ $("#body").popover({title: 'Message Body',content: "Maximum 160 characters allowed"});
});
Try this solution
add data-id for checkbox...set the value same as tr id or any
<tr id="46">
<td>
<input data-id="46" type="checkbox"></td>
<td>aaa</td>
jQuery
Add this lines in your code
var sCheckbox = new Array();
$('#mytable tr').find('input[type="checkbox"]:checked').each(function(i) {
sCheckbox.push($(this).attr("data-id"));
});
var ds = (sCheckbox.length > 0) ? sCheckbox.join(",") : "";
Modify this line
$tr.append("<td data-selected='"+ds+"'>" + creat_group + "</td>");
Add this event
$(document).on('click','#groupTable tr td',function () {
var dataids = $(this).attr("data-selected").split(",");
$('#mytable tr').find('input[type="checkbox"]').attr("checked",false);
$(dataids).each(function(key,dataid) {
$('#mytable tr').find('input[data-id="'+dataid+'"]').attr("checked",true);
})
});
Live Demo
Edit
Updated Demo
Add this data-id="mytr' + val + '" in checkbox element
$tr.append('<td class=\"cb\"><input data-id="mytr' + val + '" type=\"checkbox\" value=\"yes\" name="mytr' + val + '" unchecked ></td>');
note:check my inline comments in fiddle
This code creates a group of elements (four inputs) on the fly. Once you create an element (four inputs) you can select/deselect, when you select an element will bring up the editor for the corresponding element. I've made a function to hide only the first element. The problem is that I can not make it comeback without affecting the other elements.
Instructions:
Click on the "Price" link, an element will be created on the fly (four nested inputs)
Select the element (four nested inputs) to bring up the editor ( one input and a brown little square).
Click on the little brown square to hide the first input of the element (four nested inputs) and that will hide the first input.
I need the little brown square to hide and show the same input.
Go here to see the full code:
To see the problem you have to create more than one element to find out.
http://jsfiddle.net/yjfGx/13/
This is the JS/jQuery code, for the full code go to the link above.
var _PriceID = 1;
$('#Price').on('click',function(){
var label = 'Price'
var Id = 'Price_';
var P = $( '<p class="inputContainer" />' ).fadeIn(100);
var l = $( '<label />' ).attr({'for':Id + _PriceID, 'id':Id + _PriceID, 'class':'priceLb'}).text( label ).after('<br/>');
var l1 = $( '<span class="dollar-sign" />' ).text( '$' ).css({"font-family":"Arial", "color":"#333", "font-weight":"bold"});
var input1 = $( '<input />' ).attr({ 'type':'text', 'name':'', 'class':'inputs',
'maxlength':'3', 'placeholder':'one',
'id':Id + _PriceID, 'class':'pricePh-1' })
.css({ "width":"60px", "paddingLeft":"1.3em", "paddingRight":"0.2em", "margin":"3px" });
var l2 = $( '<span class="priceComma-1" />' ).text( ',' ).css({"font-family":"Arial", "color":"#333", "font-weight":"bold"});
var input2 = $( '<input />' ).attr({ 'type':'text', 'name':'', 'class':'inputs', 'maxlength':'3',
'placeholder':'two', 'id':Id + _PriceID, 'class':'pricePh-2' })
.css({ "width":"68px", "paddingLeft":"0.7em", "paddingRight":"0.2em", "margin":"3px" });
var l3 = $( '<span class="priceComma-2" />' ).text( ',' ).css({"font-family":"Arial", "color":"#333", "font-weight":"bold"});
var input3 = $( '<input />' ).attr({ 'type':'text', 'name':'', 'class':'inputs', 'maxlength':'3',
'placeholder':'three', 'id':Id + _PriceID, 'class':'pricePh-3' })
.css({ "width":"64px", "paddingLeft":"1em", "paddingRight":"0.2em", "margin":"3px" }); var l4 = $( '<span />' ).text( ',' ).css({"font-family":"Arial", "color":"#333", "font-weight":"bold"});
var input4 = $( '<input />' ).attr({ 'type':'text', 'name':'', 'class':'inputs', 'maxlength':'2',
'placeholder':'four', 'id':Id + _PriceID, 'class':'pricePh-4' })
.css({ "width":"37px", "paddingLeft":"0.5em", "paddingRight":"0.2em", "margin":"3px" });
P.append( l, l1, input1, l2, input2, l3, input3, l4, input4);
var D = $( 'form' );
P.on({
mouseenter: function() {
$(this).addClass("pb");
},
mouseleave: function() {
$(this).removeClass("pb");
}
});
P.appendTo(D);
_PriceID++;
});
/*** Select element individually and load editor. ***/
var flag = false;
$("form").on("click", "p", function () {
var cur = $(this).css("background-color");
if (cur == "rgb(255, 255, 255)") {
if (flag == false) {
$(this).css("background-color", "#FDD");
LoadPriceProperties($(this));
flag = true;
}
} else {
$(this).css("background-color", "white");
$('.properties-panel').hide();
flag = false;
}
});
/*** Element editor ***/
var LoadPriceProperties = function (obj) {
$('.properties-panel').css('display', 'none');
$('#priceProps-edt').css('display', 'block');
var label = $('.priceLb', obj);
var price1 = $('.pricePh-1', obj);
var price2 = $('.pricePh-2', obj);
$('#SetPricePlaceholder-1').val(price1.attr('placeholder'));
$('#SetPricePlaceholder-2').val(price2.attr('placeholder'));
/*** Getting an answer, depending on what they click on. ***/
$('#fieldOptionsContainer_1 div').bind('click', function () {
if ($(this).hasClass('field-option-delete')) {
RemoveUnwantedPriceField1($(this));
} else {
/*** Function loacated on "line 98" ***/
HideUnwantedPriceField_1($(this));
}
});
_CurrentElement = obj;
};
function HideUnwantedPriceField_1() {
var input = $('.pricePh-1', _CurrentElement);
var comma = $('.priceComma-1', _CurrentElement);
if($(input).is(":hidden")){
} else {
input.hide();
comma.hide();
}
}
Do you mean something like this: http://jsfiddle.net/Zaf8M/
var items=$('.m>li'), set= $('.set input'), num=0, item=$('.item'), list=$('.list');
item.hide();
items.click(function(){
$(this).addClass('sel').siblings().removeClass('sel');
num=$(this).index()+1;
set.prop( "disabled", false );
});
$('.close').click(function(){alert(3);});
$(window).click(function(e){
if( e.target.className=='sel' || e.target.type=='text'){return;}
else {
items.removeClass('sel'); set.prop( "disabled", true );
}
if(set.val()!='') {
item.clone().show()
.appendTo(list).children('.n').text(num)
.siblings('.p').text(set.val());
set.val('');
}
if( e.target.className=='close' ){$(e.target).parent().remove();};
});
I have the form inside the Jquery-UI-Dialog.
I understand of how to validate all field in the form.
Using the plugin of this site
Example:
$(document).ready(function () {
$('#dialog').validate({
rules: {
category:
{
required: true
},
},
submitHandler: function (form) { // for demo
if ($('#ccategory').val() == 0){
document.getElementById('choose_own_text').innerHTML = "Please change here";
return false;}
// console.log($('#ccategory').val());
alert('valid form'); // for demo
return false; // for demo
}
});
});
But I have the id and name that I created via Javascript.
For example id="inputp"+j+"_id" where j is a number.
Now I want to validate this field but i have the error:
SyntaxError: missing : after property id
I use this method because I declare with the number the data.
How to correct this error for that I can use always this technique's validate.
$( "#wnd_Add" ).dialog({
autoOpen: false,
height: 'auto',
width: 350,
modal: true,
resizable:false,
buttons: {
"Add": function() {
var j=(parseInt(contapara)+1);
$('#formparam').validate({
rules: {
"inputp"+j+"_id":
{
required: true
},
},
submitHandler: {
contapara=(parseInt(contapara)+1);
document.getElementById("sorpara").innerHTML+="<li id=\"inputp"+contapara+"_id\" class=\"ui-state-default\"><span class=\"ui-icon ui-icon-arrowthick-2-n-s\"></span>"+$('#inputp'+contapara+'_id').val()+"</li>";
var $fm = $("#formparam");
$.get($fm.attr('${nextstep}'))
.done(function(data, ok){
var fr=$fm.serialize();
fr=fr.replace(/\&/g,"+%23+");
fr=replacew(fr,/\=/g, "%24+"); // //fr=fr.replace(/\=/g,"%24+");
if(document.getElementById("inputp"+contapara+"_visible").checked==false)
fr=fr+"+%23+inputp"+contapara+"_visible%24+off";
// data is the content of the response
document.location.href="index2?"+fr;})
.fail(function(data){
alert('call failed');
// call failed for some reason -- add error messaging?
});
// $( this ).dialog( "close" );
return false; },
},
Cancel: function() {
$( this ).dialog( "close" );
}
},
close: function() {
$( this ).dialog( "close" );
}
});
I created a demo on Jsfiddle but not function because I have this error but may help
I hope the title of the question is correct...
UPDATE:
Now I have this script but I have the error SyntaxError: missing : after property id on
function(form) {
This is last script:
$( "#wnd_Addparam" ).dialog({
autoOpen: false,
height: 'auto',
width: 350,
modal: true,
resizable:false,
buttons: {
"Add": function() {
var j=(parseInt(contapara)+1);
var rules= {};
rules["inputp" + j + "_id"]=
{
required: true
};
$('#formparam').validate({
rules: rules,
submitHandler: {
function(form) {
contapara=(parseInt(contapara)+1);
document.getElementById("sorpara").innerHTML+="<li id=\"inputp"+contapara+"_id\" class=\"ui-state-default\"><span class=\"ui-icon ui-icon-arrowthick-2-n-s\"></span>"+$('#inputp'+contapara+'_id').val()+"</li>";
var $fm = $("#formparam");
$.get($fm.attr('${nextstep}'))
.done(function(data, ok){
var fr=$fm.serialize();
fr=fr.replace(/\&/g,"+%23+");
fr=replacew(fr,/\=/g, "%24+"); // //fr=fr.replace(/\=/g,"%24+");
if(document.getElementById("inputp"+contapara+"_visible").checked==false)
fr=fr+"+%23+inputp"+contapara+"_visible%24+off";
// data is the content of the response
document.location.href="index2?"+fr;})
.fail(function(data){
alert('call failed');
// call failed for some reason -- add error messaging?
});
return false; } },
});
},
Cancel: function() {
$( this ).dialog( "close" );
}
},
close: function() {
$( this ).dialog( "close" );
}
});
You can't use a variable as a key in a object like that, instead you can do something like
var rules = {};
rules["inputp"+j+"_id"] = {
required: true
};
$('#formparam').validate({
rules: rules,
submitHandler: {
Ex;
var contapara = 3;
var regex, v, l, c, b;
$("#wnd_Addparam").dialog({
autoOpen : false,
height : 'auto',
width : 350,
modal : true,
resizable : false,
buttons : {
"Add" : function() {
var j = (parseInt(contapara) + 1);
var rules = {};
rules["inputp" + j + "_id"] = {
required : true
};
$('#formparam').validate({
rules : rules,
submitHandler : function(form) {
contapara = (parseInt(contapara) + 1);
document.getElementById("sorpara").innerHTML += "<li id=\"inputp"
+ contapara
+ "_id\" class=\"ui-state-default\"><span class=\"ui-icon ui-icon-arrowthick-2-n-s\"></span>"
+ $('#inputp' + contapara + '_id').val() + "</li>";
var $fm = $("#formparam");
$.get($fm.attr('${nextstep}')).done(function(data, ok) {
var fr = $fm.serialize();
fr = fr.replace(/\&/g, "+%23+");
fr = replacew(fr, /\=/g, "%24+"); // //fr=fr.replace(/\=/g,"%24+");
if (document.getElementById("inputp" + contapara
+ "_visible").checked == false)
fr = fr + "+%23+inputp" + contapara
+ "_visible%24+off";
// data is the content of the response
document.location.href = "index2?" + fr;
}).fail(function(data) {
alert('call failed');
// call failed for some reason -- add error
// messaging?
});
return false;
}
})
},
Cancel : function() {
$(this).dialog("close");
}
},
close : function() {
$(this).dialog("close");
}
});
$("#btn_Addpar").click(function() {
i = (parseInt(contapara) + 1);
$("#formparam").remove();
$("#wnd_Addparam")
.append('<form method="GET" name="formparam" id="formparam" action="${nextstep}">\
<input type="hidden" name="json_data" value="${json_data}">\
<input type="hidden" name="tag" value="${tag}">\
<table><tr><td><label>ID</label></td><td>\
<textarea class="expand" name="inputp'
+ i
+ '_id" id="inputp'
+ i
+ '_id"></textarea></td></tr>\
<tr><td><label>Type</label></td><td><select name="inputp'
+ i
+ '_type" id="inputp'
+ i
+ '_type">\
<option value="text">Text</option><option value="integer">Integer</option><option value="float">Float</option>\
<option value="list_values">List of values</option><option value="range">Range</option>\
<option value="selection_collapsed">Selection (collapsed)</option>\
<option value="selection_expanded">Selection (expanded)</option>\
<option value="subimage">Subimage selection</option>\
<option value="polygon">Polygon selection</option>\
<option value="horizontal_separator">Horizontal separator</option>\
</select></td></tr><tr><td><label> Description</label></td>\
<td><textarea class="expand" name="inputp'
+ i
+ '_description" id="inputp'
+ i
+ '_description"></textarea></td></tr>\
<tr><td><label>Value</label></td><td><textarea class="expand" name="inputp'
+ i
+ '_value" id="inputp'
+ i
+ '_value"></textarea></td></tr>\
<tr><td><label>Info (help)</label></td><td><textarea class="expand" id="inputp'
+ i
+ '_info" name="inputp'
+ i
+ '_info"></textarea></td></tr>\
<tr><td><label> Visible?</label></td><td><input type="checkbox" id="inputp'
+ i
+ '_visible" name="inputp'
+ i
+ '_visible" checked></td></tr></table></form>');
$("#wnd_Addparam").dialog("open");
});