I've updated jQuery UI to latest version (from 1.9.x) and there's something that I can not resolve, namely: in title attriutes I sometimes store HTML, for instance:
Start Date: 2012.01.01<br />End Date: 2012.02.01
Before upgrade tooltip text was not encoded so I saw Start & End date in two separate lines. However now, text in encoded and I see . Is there a way to resolve it?
My answer is an extension to what Fran said.
Ran into this as well. You can store simple html tags in title. Instead of just calling tooltip, you now have to do some more work. You have to return your html coded title. I have tested this with bold < b>, underline < u> and breakline < /br>.
$( document ).tooltip( {
content: function() {
return $( this ).attr( "title" );
}
});
The problem is that title doesn't admit HTML tags. To apply style to text in title attribute using Tooltips, you should use something like this:
HTML:
<a id="mytooltip" href="#" title="">Tooltips</a>
JS:
$('#mytooltip').tooltip({
items: "[title]",
content: function() {
return "<b>That's what this widget is</b>";
}
});
You can use any HTML tags (even tables, images, etc) and JQueryUI Tooltip
Show it running in JSBin: http://jsbin.com/ukejok/3/
Related
My problem is quite simple.
I want to use a flat sstring for the content function within the tooltip,
instead of using the value of title attributes.
But why mine code is not working?
$(function () {
$(document).tooltip({
content: "amsdmkam";
});
});
JSFiddle : http://jsfiddle.net/matildayipan/vdc6adwv/
If you want a flat string content instead of using the value of title attribute, you also must put title attribute in input tag
Another error is the semicolon after content: "amsdmkam".
Please check again with my edit
JSFiddle : http://jsfiddle.net/vdc6adwv/2/
How to get href value of <a> element and store it to a variable with jquery mobile?
This is my snippet code:
$('a').live('click', function() {
var href = $(this).attr('href');
console.log("href value: |"+href);
});
Here is sample:
Link
In my log cat (btw I am using jquery mobiel for phonegap), it returns : href value: |#
What i want is, something like this in my logcat:
href value: | 117.xx.xx.xx/timesheet/file.pdf
I'm using phonegap 2.9
Based on the symptoms you describe, it seems as though the a tag firing the click event has an href of #. Possibly some other tag wrapping your intended anchor? Try a more specific selector and see if that works, maybe something like:
$('#myLink').live('click', function() {
var href = $(this).attr('href');
console.log("href value: |"+href);
});
With this for a link:
Link
If it still gives you a #, then is it possible that the href value is populated after your click event is firing (possibly by some other javascript)?
Finally, solved. After frustating with jquery 'live' and 'on', I'm using plain Javascript function to get value of link in attribute: getAttribute('href'). And that worked!! Anyway, thank's for all the answer.
I've been using the tag-it plugin from https://github.com/aehlke/tag-it (demo - http://aehlke.github.com/tag-it/examples.html).
In this code there is an option to display the inputted tags in another input, textarea etc. First option -
$('#singleFieldTags').tagit({
availableTags: sampleTags,
singleField: true,
singleFieldNode: $('#mySingleField')
});
Here the id - #singleFieldTags is the inputting field which is a list like <ul and id - #mySingleField displays the 'list-ordered' tags with commas between each.
All the tags that are added and removed in the #singleFieldTags appear in the #mySingleField. Since there is no built-it sortable function with tag-it, adding a sortable() to change the order of tags in #singleFieldTags, does not change the order of tags in #mySingleField.
The second option is a plain with only #singleFieldTags as follows :-
$('#singleFieldTags').tagit({
availableTags: sampleTags,
});
Although in tag-it.js there is a , the value does not appear in the mysql table after submitting the php form as the above list of tags is placed between <li></li>.
How is it possible to make the tags sortable and ensure that the same arrangement of tags in the list field <ul to be displayed in the <textarea as in First Option? Or How can the second option of sorting tags within a single field <input work and enabling it to be submitted by a form?
EDIT: There is a similar plugin like Tag-it called tagit here: http://webspirited.com/tagit/ . This plugin has sortable with an input box meaning if the tags were interchanged, and when submitted on form it would appear in the order of the sort. However, the disadvantage being that it has custom themeroller themes these are not similar and cannot even be linked to the ones at jQuery UI (jqueryui.com).
But on the other hand, the tag-it plugin (not tagit), can be loaded with these themes but does not provide the sortable function.
Here's a solution that uses the tag-it plugin, because I understand that your missing functionality is explained in your quote "...adding a sortable() to change the order of tags in #singleFieldTags, does not change the order of tags in #mySingleField".
In order to have "#mySingleField" reflect the new sort order, I'm adding a handler to the stop event of sortable():
$('#singleFieldTags').sortable({
stop: function(event,ui) {
$('#mySingleField').val(
$(".tagit-label",$(this))
.clone()
.text(function(index,text){ return (index == 0) ? text : "," + text; })
.text()
);
}
});
and
$('#singleFieldTags2').siblings(".tagit").sortable({
stop: function(event,ui) {
$('#singleFieldTags2').val(
$(".tagit-label",$(this))
.clone()
.text(function(index,text){ return (index == 0) ? text : "," + text; })
.text()
);
console.log( $('#singleFieldTags2').val() ); // just for reference
}
});
Here is a jsfiddle that demonstrates the functionality
(added functionality for single input field)
I am using cordova 2.2.0 with Xcode 4.5.2. On one of my pages I have a select component and once a particular option is selected I want to display a table within a div. My html looks like this: <div class="hero-unit" id="#facprog"></div>
The javascript/jquery looks like this:
<pre><code>
$(function() {
$('#selFaculty').change(function() {
var facultyName = $('#selFaculty').val();
var progDetails = app.fillFacultyProgramme(facultyName);
alert(progDetails);
$('#facprog').append(progDetails);
});
});
</code></pre>
Note that #selFaculty is the id of the select object. However, when the select option changes, everything in javascript executes except for the append. Nothing shows up in the div. Is there a different way to add html element to a div in jquery under cordova 2.2.0 in iOS?
Thanks in advance,
José
With jquery you can refresh a div.
This is a good example:
<script>
var auto_refresh = setInterval(
function()
{
$('#loaddiv').fadeOut('slow').load('reload.php').fadeIn("slow");
}, 20000);
</script>
and now you need to put the div in the body section of your page
<div id="loaddiv">
</div>
from http://designgala.com/how-to-refresh-div-using-jquery/
and there is another example here:
refresh div with jquery
The first example is useful when you need to load a script and refresh and the second one is useful when you need to make a change, e.g. append html and then refresh as in your case.
I am trying to put the '¡' character (¡ in HTML) in one of my jQuery UI dialog buttons, but I can't figure out how this works. Here's my code:
registerhtml.dialog({
modal: true,
title: 'Registro en entreSartenes',
resizable: false,
buttons: [
{
text: "¡Regístrate!",
click: function(){
$(this).dialog('close');
connect();
}
},
{
text: "No gracias",
click: function() {
$(this).dialog('close');
}
}
]
});
When the dialog pops up, I actually get "¡Regístrate!" in my button. I have also tried putting the unescaped text directly in the JS code ("¡Regístrate!") but I get weird characters when it gets displayed.
Does anyone know a solution for this?
Since you're using javascript and not HTML, you'll need to put the actual character, not the HTML entity. You'll be able to do it if you use the right encoding (like UTF-8, but any encoding that can represent the characters you need should work). Make sure your file is UTF-8 and that it is interpreted as such by the browser, by setting the encoding in the HTTP headers or the HTML meta elements.
There is always an alternative in jQuery, you can do this:
var text = $('<i/>').html('í').text();
alert(text); // ---> á
It will create an unattached i tag, then evaluate the string í as HTML, then retrieve the rendered text content.
Also i found out you can use
\hexcode
works well
"Har hentet V\xE6rge": function() {
$( this ).dialog( "close" );
http://www.javascripter.net/faq/accentedcharacters.htm