I am having an issue inserting variables into the modal functions position option. The following works:
$.modal('<iframe id = "framedetails" src="' + src + '" height="' + vHeight + 'px;" width="' + vWidth + 'px;" style="border:0"></iframe>', {
closeHTML:"<a href='#' class='modalCloseImg' alt='Close/Cancel' title='Close/Cancel'><a>", //add close button
fixed: false,
position: ["75px","595.5px"],
overlayClose:false
});
How would I insert a variable for each of the position values? I am unable to get the concatenation correct and have tried many variations.
For example, position: ["" + vTop + "","" + vLeft + ""] seems to insert the value for vTop but the vLeft variable is not being applied. If I supply the actual value in this for vLeft, it works as expected. What am I missing here?
I figured this out...pretty silly of me. I just create a string array of the two variables (vTop and vLeft) and passed them in.
vArray = ["" + vTop + "","" + vLeft + ""];
...
position: vArray
Related
I would like to know how to add a newline in a computed string with the concatenation of string values. I need the values to be this.
1111 Ave, Apt 107
Iowa mycity, myzip
Here's what I have.
companyAddress()
{
return this.lead.address + ", " + this.lead.address2 + '\n' +
this.lead.state + ", " + this.lead.city + " " + this.lead.zip;
}
I get values no problem, but I can't get the \n to separate to two lines.
You can use v-html in your template.
<span v-html="companyAddress"></span>
companyAddress() {
return `${this.lead.address, ${this.lead.address2} <br> ${this.lead.state}, ${this.lead.city} ${this.lead.zip}`;
}
When victory line chart display the x-axis labels, the labels are on one line and I would like to display the label with text-wrapping. See the two images below to see what it is doing currently and what I would like for it to do.
Currently What is Happening
The image below is what I would like to happen. What I would like
I have created a function in the tickFormat to provide custom label text and that part is working.
<VictoryAxis fixLabelOverlap={true} tickFormat={t => this.formatLabel(t)} />
formatLabel = (t) => {
var x = new Date(t);
var s = x.getHours() + ":" + x.getMinutes() + (x.getMonth() + 1) + '/' + x.getDate();
return s;
}
You should be able to create a new line with a line break "\n"
formatLabel = (t) => {
var x = new Date(t);
var s = x.getHours() + ":" + x.getMinutes() +'\n'+ (x.getMonth() + 1) + '/' + x.getDate();
return s;
}
"background-image:url("+bg+")" , what is the + sign for ? Vue.js
as title . i dont understand why there are + sign added in url() ?
computed:{
content_bg(){
return "background-image:url(" + this.poiInfo.head_pic_url + ")"
},
any answer will be appreciated!
The + sign is not for the url. It is being used as string concatenation operator here. It adds the second string at the end of the first string. For example "a" + "b" equals "ab".
Your function is returning an string. If the value of this.poiInfo.head_pic_url is, lets says, www.example.com/head_pic then your function content_bg() will return a string value of background-image:url(www.example.com/head_pic).
content_bg(){
return "background-image:url(" + this.poiInfo.head_pic_url + ")"
},
I have a tablesorter project which has been working good with client side paging since some months. Now I have to turn it to server side paging but I can't get it to work with all the features I was using with client side version.
As on subject, my problem is to make the contenteditable feature to work.
What I've done to achieve that, is to write a custom function to bind to ajaxProcessing handler on the tablesorterPager config:
ajaxProcessing: function (data) {
if (data && data.hasOwnProperty('rows')) {
var str = "", d = data.rows,
// total number of rows (required)
total = data.total_rows,
// len should match pager set size (c.size)
len = d.length;
for (var i = 0; i < len; i++) {
str += '<tr>';
for (var column = 0; column < orderedFieldMapping.length; column++) {
if (orderedFieldMapping[column].toUpperCase() != 'ACTIVATIONDATE' || bReadOnly)
str += '<td class="' + orderedFieldMapping[column].toUpperCase() + '"' + ($('#' + orderedFieldMapping[column].toUpperCase()).prop('checked') ? '' : 'style="display:none;"') + '><div>' + (eval('d[i].' + orderedFieldMapping[column]) != null ? eval('d[i].' + orderedFieldMapping[column]) : '') + '</div></td>';
else
str += '<td class="' + orderedFieldMapping[column].toUpperCase() + '"' + ($('#' + orderedFieldMapping[column].toUpperCase()).prop('checked') ? '' : 'style="display:none;"') + '><div ' + (eval('d[i].' + orderedFieldMapping[column]) != null ? '' : 'class="emptyPlaceholder"') + 'onmouseup="javascript:SelectActivationDateText(this);" onblur="javascript:RestoreCellStyle(this);">' + (eval('d[i].' + orderedFieldMapping[column]) != null ? eval('d[i].' + orderedFieldMapping[column]) : emptyTextString) + '</div></td>';
}
str += '</tr>';
}
// in version 2.10, you can optionally return $(rows) a set of table rows within a jQuery object
return [total, $(str)];
}
},
Please note that I'm returning a set of table rows within a jQuery object, option allowed as stated on the docs example comment (also visible on this code sample). The reason why I do such thing is that I need to control table markup to add styles, handlers and classes. That's what I do in the inner for cycle, and it's not very important knowing exactly what I'm doing there.
What is important is that I get the expected result and markup for my table, and server side paging is working with no issue, BUT contenteditable widget is not working.
I get no warnings on js console and all is working just fine, but I can't edit columns I marked as editable. I can see that also looking at the markup because contenteditable attribute is not present at all. Of course the widget is inintialized and configured (in the same way that it was on previous version, with client side paging).
Another hint that points on some widget malfunction (maybe): I managed to manually add (inside the very same function I posted above) the contenteditable attribute on the markup just to see if it would give me some information. In this case I can edit the content as expected, but I get no handler for editComplete event, and data acceptance settings are not applying. I could still manually add handlers and custom code to get it to work as intended, but it would be bad and I don't want to use a hack to get an already implemented feature to work.
Any hint would be appreciated, thanks to everyone who will answer.
I think I see the issue. The contenteditable widget does not re-apply the contenteditable property on the elements within the table cells when the content is updated (via the pager, or whatever).
So this is definitely a bug, I just opened a ticket: https://github.com/Mottie/tablesorter/issues/732
In the mean time, you can add the contenteditable property to the div in your markup:
str += '<td><div contenteditable>...</div></td>';
I have tree created with Dynatree, with checkboxes in it.
Can you help me how can I get a list (or array) of checked checkboxes in it, so I can manipulate with them (move them into another tree)?
Tnx in adv!
Ok, here it is:
var selNodes = node1.tree.getSelectedNodes();
// convert to title/key array
var selKeys = $.map(selNodes, function(node1){
alert("[" + node1.data.key + "]: '" + node1.data.title + "'");
});