BoldSignA modern eSignature application with affordable pricing. Sign up today for unlimited document usage!
Hi.
In the next image you can see the "ejDropdownlist" component, it's very short, so I you can't see the selected item. How can I add a tooltip in order to see the selected item?
I will be awaiting for your reply, thanks in advance.
Kind regards, Luis.
$('#bikeList').ejDropDownList({
dataSource: BikeList,
width: "60px",
fields: { id: "empid", text: "text", value: "text" },
create:"onCreate"
});
function onCreate() {
this.container.ejTooltip({
content: this.model.value,
open: "onOpen"
});
}
|
function onOpen () {
var ddlObj= $('#bikeList').data("ejDropDownList");
this.setModel({ content: ddlObj.model.value});
}
|
This solution sounds perfect! however I can't use the word "this", because I already use it for another thing, so, can you provide me another solution? please.
I will be awating for your reply, thanks again!
Kind regards, Luis.
<input type="text" id="bikeList" />
<script type="text/javascript">
var ddlObj,tipObj;
$(function () {
// declaration
BikeList = [
{ empid: "bk1", text: "Apache RTR" }, { empid: "bk2", text: "CBR 150-R" }, { empid: "bk3", text: "CBZ Xtreme" },
{ empid: "bk4", text: "Discover" }, { empid: "bk5", text: "Dazzler" }, { empid: "bk6", text: "Flame" },
{ empid: "bk7", text: "Fazzer" }, { empid: "bk8", text: "FZ-S" }, { empid: "bk9", text: "Pulsar" },
{ empid: "bk10", text: "Shine" }, { empid: "bk11", text: "R15" }, { empid: "bk12", text: "Unicorn" }
];
$('#bikeList').ejDropDownList({
dataSource: BikeList,
width: "60px",
fields: { id: "empid", text: "text", value: "text" },
create:"onCreate"
});
});
//Dropdownlist's create event
function onCreate() {
ddlObj= $('#bikeList').data("ejDropDownList"); // dropdownlist's object
//Rendering tooltip
ddlObj.container.ejTooltip({
content: ddlObj.model.value,
open: "onOpen"
});
}
//Tooltip's open event
function onOpen () {
//Tooltip's object
tipObj= $('#bikeList_container').data("ejTooltip"); // "bikeList_container" is the id attribute for dropdownlist's container
// setting content for tooltip
tipObj.setModel({ content: ddlObj.model.value});
}
</script>
|
Hi again.
I've been trying to adapt your code snippet to my project as you can see in the image 1, however, I couldn't solve the problem of the image 2. Could you help me with this problem? it seems that it doesn't recognise the function "ejTooltip".
Image 1
Image 2
I will be awating for your reply, thanks again!
Regards, Luis.
function onCreate() {
ddlObj= $('#bikeList').data("ejDropDownList");
$(ddlObj.container).ejTooltip({
content: ddlObj.model.value,
open: "onOpen"
});
}
|
Hi again.
It wasn't fixed as you can see in the two next images, so the third image contains the file version.
Image 1
Image 2
Image 3
If you need any further information, please let me know. Thanks again!
Regards, Luis Carlos.