Related
I'm looking to show a little pin image next to the column name on columns that are pinned just so it's more obvious.
I'm already using a custom header as I show a menu icon for each column that gives functionality per column, but not sure how to tell if the column is pinned and then display an image when pinned.
Here is my current custom header:
var newValuesColumnHeaderTemplate = '<div role="columnheader"' +
' ng-class="{ \'sortable\': sortable }"' +
' ui-grid-one-bind-aria-labelledby-grid="col.uid + \'-header-text \' + col.uid + \'-sortdir-text\'"' +
' aria-sort="{{col.sort.direction == asc ? \'ascending\' : ( col.sort.direction == desc ? \'descending\' : (!col.sort.direction ? \'none\' : \'other\'))}}">' +
' <div class="list-icon">' +
' <span class="glyphicon glyphicon-list" ng-click="grid.appScope.editOptionValues(col.field)"></span>' +
' </div>' +
'' +
' <div role="button"' +
' tabindex="-1"' +
' style="padding-left:15%"' +
' class="ui-grid-cell-contents ui-grid-header-cell-primary-focus"' +
' col-index="renderIndex"' +
' title="TOOLTIP">' +
' <span class="ui-grid-header-cell-label"' +
' ui-grid-one-bind-id-grid="col.uid + \'-header-text\'">' +
' {{ col.displayName CUSTOM_FILTERS }}' +
' </span>' +
' <span ui-grid-one-bind-id-grid="col.uid + \'-sortdir-text\'"' +
' ui-grid-visible="col.sort.direction"' +
' aria-label="{{getSortDirectionAriaLabel()}}">' +
' <i ng-class="{ \'ui-grid-icon-up-dir\': col.sort.direction == asc, \'ui-grid-icon-down-dir\': col.sort.direction == desc, \'ui-grid-icon-blank\': !col.sort.direction }"' +
' title="{{col.sort.priority ? i18n.headerCell.priority + \' \' + col.sort.priority : null}}"' +
' aria-hidden="true">' +
' </i>' +
' <sub class="ui-grid-sort-priority-number">' +
' {{}}' +
' </sub>' +
' </span>' +
' </div>' +
' <div role="button"' +
' tabindex="-1"' +
' ui-grid-one-bind-id-grid="col.uid + \'-menu-button\'"' +
' class="ui-grid-column-menu-button"' +
' ng-if="grid.options.enableColumnMenus && !col.isRowHeader && col.colDef.enableColumnMenu !== false"' +
' ng-click="toggleMenu($event)"' +
' ng-class="{\'ui-grid-column-menu-button-last-col\': isLastCol}"' +
' ui-grid-one-bind-aria-label="i18n.headerCell.aria.columnMenuButtonLabel"' +
' aria-haspopup="true">' +
' <i class="ui-grid-icon-angle-down"' +
' aria-hidden="true">' +
' ' +
' </i>' +
' </div>' +
' <div ui-grid-filter></div>' +
'</div>';
One way around this may be to target the pinned columns via CSS, e.g. (assuming FontAwesome has been referenced for images):
.ui-grid-pinned-container .ui-grid-header-cell {
position: relative;
}
.ui-grid-pinned-container .ui-grid-header-cell:after {
position: absolute;
font-family: 'FontAwesome';
content: '\f08d'; // fa-thumb-tack
font-size: .75em;
right: 2em;
top: 0.5em;
width: 1em;
height: 1em;
}
See: http://plnkr.co/edit/RU4KnysM6s0aeYzI3KYJ?p=preview
I am facing an problem in phonegap while integrating native EmailComposer.
MailComposer should open up on button click, but it does not shows the mailComposer for IOS, same code for android is working,
My Code is as follow:
<html>
<head>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8" src="emailcomposer.js"></script>
<script type="text/javascript">
document.addEventListener("deviceready", deviceready, true);
function deviceready() {
console.log("Device ready");
}.
//function to send mail using mail composer
function composeText(){
var vehiclemileage = document.getElementById('vehiclemileage').value;
var vehiclemodel = document.getElementById('vehiclemodel').value;
var message1 = document.getElementById('message_body').value;
var vechicleyear = document.getElementById("yeardropdown");
var strUser = vechicleyear.options[vechicleyear.selectedIndex].value;
var vehiclemake = document.getElementById("vehiclemake");
var makevehicle = vehiclemake.options[vehiclemake.selectedIndex].value;
var deviceName = device.platform;
var devicemodel = device.model;
if(vehiclemodel == '' || makevehicle == ''){
alert("Please Enter all the Value");
navigator.notification.alert(
'Please Enter all the Value', // message
alertDismissed, // callback
'Vehicle and Model', // title
'Ok' // buttonName
);
}
else
{
//function to check folder named "RepairMyCar" and extract picture from folder to attach it to mail
var attachPath;
var attachFile= new Array();
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSystem) {
fileSystem.root.getDirectory("RepairMyCar", {
create: true
},
function(directory) {
console.log("Final 63" + directory.fullPath);
attachPaths = directory.fullPath;
var attachPath=attachPaths.slice(7,attachPaths.length);
var directoryReader = directory.createReader();
directoryReader.readEntries(function(entries) {
var i;
for (i=0; i<entries.length; i++) {
console.log(entries[i].name);
attachFile[i] =attachPath + "/" + entries[i].name;
}
console.log(attachFile);
},
function (error) {
alert(error.code);
});
});
}, function(error) {
alert("can't even get the file system: " + error.code);
});
var dated, fnamed, phoned, emailed;
if(typeof(Storage)!=="undefined")
{
dated = localStorage.date;
fnamed = localStorage.fname;
phoned = localStorage.phone;
emailed= localStorage.email;
}
console.log(attachFile);
var newattachment = attachFile.toString();
//Open mail composer with all datas
setTimeout(function(){window.plugins.emailComposer.showEmailComposerWithCallback(null,
"Get an Estimate",
"Date: " + dated + '<br>' + "First Name: " + fnamed + '<br>' + "Phone Number: " + phoned + '<br>' + "Email Address: " + emailed + '<br>' + "Year of Vehicle: " + strUser + '<br>' + "Make of Vehicle: " + makevehicle + '<br>' + "Model of Vehicle: " + " " + vehiclemodel + '<br>' +
"Mileage of Vehicle: " + " " + vehiclemileage + '<br>' + message1 + '<br>' + "Sent from My:" + deviceName + devicemodel,
[sth#sth.com],
[],
[],
true,
attachFile
);},100);
//Clear LoccalStorage
localStorage.clear();
//exit the app after clicking this button
navigator.app.exitApp();
// navigator.camera.cleanup(onSuccess,fail);
// function onSuccess(){
// }
// function fail(){
// }
}
}
function onFail(message) {
alert('Failed because: ' + message);
}
/***********************************************
* Drop Down Date select script- by JavaScriptKit.com
* This notice MUST stay intact for use
* Visit JavaScript Kit at http://www.javascriptkit.com/ for this script and more
***********************************************/
//function to load year in drodown. Default selected year : Current Year
function populatedropdown(yearfield){
var today=new Date()
var yearfield=document.getElementById(yearfield)
for (var i=0; i<31; i++)
//Select Year
var thisyear=today.getFullYear()
for (var y=0; y<25; y++){
yearfield.options[y]=new Option(thisyear, thisyear)
thisyear-=1
}
yearfield.options[0]=new Option(today.getFullYear(), today.getFullYear(), true, true) //select today's year
}
</script>
</head>
<body>
<div class="wrapper">
<h1>Get a Repair Estimate</h1>
<div class="main-content">
<p>
Please Enter the Year, Make, Model and Mileage of Your Vehicle and any other information we should know.
</p>
<form class="vehicle-detail-form">
<ul>
<li>
<label>Year of Vehicle: </label>
<form action="" name="someform">
<select id="yeardropdown">
</select>
</form>
<script type="text/javascript">
//populatedropdown(id_of_day_select, id_of_month_select, id_of_year_select)
window.onload=function(){
populatedropdown("yeardropdown")
}
</script>
</li>
<!-- Vehicle Year Selection -->
<li><label>Model of Vehicle:</label>
<input type="text" name="vehiclemodel" id = "vehiclemodel">
</li>
<li><label>Mileage of Vehicle:</label>
<input type="number" name="vehiclemileage" id = "vehiclemileage"></li>
<li>
<textarea name="message_body" id = 'message_body' placeholder="Add Notes here(if any)"></textarea>
</li>
</form>
<div style="clear:both;"></div>
<div class="large-button-wrapper">
<button onclick="composeText();">Get Your Estimate</button>
</div>
</div>
</div>
</body>
</html>
I have kept EmailComposer.h and EmailComposer.m in plugin folder as stated in this link
I found a workaround if you work on an iOS project. I have the same issue.
After view change in backbone router console.log stops working in Xcode you can use Safari Web Inspector on your Mac. Every console.log is visible there.
I'm having a bit of a problem with putting a jQuery UI tab menu inside a Google Map InfoWindow.
The infowindows are created from a Fusion Table which is layered on the base map. I've got an example using the Maps infowindows that works perfectly (still has styling to be done and the data is incomplete, though)
However, the infowindows are a bit too restrictive and I need more flexibility in styling, so I switched over to using InfoBox.js. Thankfully, it fits in pretty well, and all I had to do was change a few selectors so it all matched up. The boxes work perfectly BUT the jquery tabs now don't work at all. The class attributes that should be created in the HTML, aren't.
Here's the original script using infowindows:
<link type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/themes/base/jquery-ui.css" rel="stylesheet" />
<script src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load('maps', '3', {other_params:'sensor=false'});
google.load('jquery', '1');
google.load("jqueryui", "1");
</script>
<script type="text/javascript">
function initialize() {
var map = new google.maps.Map(document.getElementById('map-canvas'), {
zoom: 7,
center: new google.maps.LatLng(52.51112385136416, -3.718475750781187),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var layer = new google.maps.FusionTablesLayer({
query: {
select: "col2>>1",
from: "1GbF1tKsgQshl1kxOLNDGgw52Wv8bWYL6njpcKVI"
},
styleId: 2,
map: map,
suppressInfoWindows: true
});
var infowindow = new google.maps.InfoWindow();
google.maps.event.addListener(layer, 'click', function(e) {
var childpoverty = e.row['Child poverty rate'].value;
if (childpoverty > 22) {
pcolour = '<p style="color: red; font-weight: bold;">';
}
else if (childpoverty > 13) {
pcolour = '<p style="color: orange; font-weight: bold;">';
}
else {
pcolour = '<p style="color: green; font-weight: bold;">';
};
var sponsored = e.row['Sponsorship'].value;
if (sponsored == 1) {
contentString = [
'<div class="tabs">',
'<ul>',
'<li><span>Sponsor</span></li>',
'<li><span>Information</span></li>',
'</ul>',
'<div id="tab-1">',
'<p style="font-weight: bold;">' + e.row['Local authority'].value + '</p>',
'<img src="' + e.row['Logo'].value + '" width="100"></img>',
'</div>',
'<div id="tab-2">',
'<p style="font-weight: bold;">' + e.row['Local authority'].value + '</p>',
'<p>' + e.row['Political control'].value + '</p>',
pcolour + e.row['Child poverty rate'].value + '</p>',
'<p>' + e.row['Unemployment rate'].value + '</p>',
'</div>',
'</div>'
].join('')}
else {
contentString = [
'<div class="tabs">',
'<p style="font-weight: bold;">' + e.row['Local authority'].value + '</p>',
'<p>' + e.row['Political control'].value + '</p>',
pcolour + e.row['Child poverty rate'].value + '</p>',
'<p>' + e.row['Unemployment rate'].value + '</p>',
'</div>'
].join('')};
infowindow.setContent(contentString);
infowindow.setPosition(e.latLng);
infowindow.open(map);
$(".tabs").tabs({ selected: 0 });
});
}
</script>
And here's the script with the infowboxes
<link type="text/css" href="http://code.jquery.com/ui/1.8.12/themes/smoothness/jquery-ui.css" rel="stylesheet" />
<script src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load('maps', '3', {other_params:'sensor=false'});
google.load('jquery', '1');
google.load("jqueryui", '1');
</script>
<script src="http://google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.1.9/src/infobox_packed.js"></script>
<script type="text/javascript">
function initialize() {
var map = new google.maps.Map(document.getElementById('map-canvas'), {
zoom: 7,
center: new google.maps.LatLng(52.51112385136416, -3.718475750781187),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var layer = new google.maps.FusionTablesLayer({
query: {
select: "col2>>1",
from: "1GbF1tKsgQshl1kxOLNDGgw52Wv8bWYL6njpcKVI"
},
styleId: 2,
map: map,
suppressInfoWindows: true
});
var ib = new InfoBox();
google.maps.event.addListener(layer, 'click', function(e) {
var childpoverty = e.row['Child poverty rate'].value;
if (childpoverty > 22) {
pcolour = '<p style="color: red; font-weight: bold;">';
}
else if (childpoverty > 13) {
pcolour = '<p style="color: orange; font-weight: bold;">';
}
else {
pcolour = '<p style="color: green; font-weight: bold;">';
};
var sponsored = e.row['Sponsorship'].value;
if (sponsored == 1) {
iboxText = [
'<div class="tabs">',
'<ul>',
'<li><span>Sponsor</span></li>',
'<li><span>Information</span></li>',
'</ul>',
'<div id="tab-1">',
'<p style="font-weight: bold;">' + e.row['Local authority'].value + '</p>',
'<img src="' + e.row['Logo'].value + '" width="100"></img>',
'</div>',
'<div id="tab-2">',
'<p style="font-weight: bold;">' + e.row['Local authority'].value + '</p>',
'<p>' + e.row['Political control'].value + '</p>',
pcolour + e.row['Child poverty rate'].value + '</p>',
'<p>' + e.row['Unemployment rate'].value + '</p>',
'</div>',
'</div>'
].join('')}
else {
iboxText = [
'<div class="tabs">',
'<p style="font-weight: bold;">' + e.row['Local authority'].value + '</p>',
'<p>' + e.row['Political control'].value + '</p>',
pcolour + e.row['Child poverty rate'].value + '</p>',
'<p>' + e.row['Unemployment rate'].value + '</p>',
'</div>'
].join('')};
var myOptions = {
disableAutoPan: false
,maxWidth: 0
,pixelOffset: new google.maps.Size(-140, 0)
,zIndex: null
,boxStyle: {
background: "white"
,opacity: 0.75
,width: "280px"
,padding: "5px"
}
,closeBoxMargin: "10px 2px 2px 2px"
,closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif"
,infoBoxClearance: new google.maps.Size(1, 1)
,isHidden: false
,pane: "floatPane"
,enableEventPropagation: false
};
ib.setOptions(myOptions);
ib.setContent(iboxText);
ib.setPosition(e.latLng);
ib.open(map);
$(".tabs").tabs({ selected: 0 })
});
}
</script>
Like I say, virtually completely the same, except the second one, no tabs.
I am SO stuck, any help would be so appreciated.
call $.tabs() when the domready-event of the infobox fires(the infobox has been attached to the DOM at this time, when you call $.tabs() earlier the infobox-content cannot be found by jQuery):
google.maps.event.addListener(ib,'domready',function(){
$(".tabs").tabs({ selected: 0 })
});
This worked for me:
google.maps.event.addListener(infoWindow, 'domready', function() {
jQuery("#tabs").tabs();
});
I have written
1) scripts using datatable.js to show data
2) autocomplete method
PortletDraggable.init();
FormFileUpload.init();
EducationalQualification.init();
WorkExperience.init();
Supervisions.init();
Awards.init();
Publication.init();
All these are datatable methods working properly. But when I add jquery.auto-complete.js script reference, these methods stop working and autocomplete start working.
Where is the problem, please suggest.
<script>
$('.date-picker').datepicker({
format: 'mm/dd/yyyy'
});
// var oTable = null;
jQuery(document).ready(function () {
App.init();
PortletDraggable.init();
FormFileUpload.init();
EducationalQualification.init();
WorkExperience.init();
Supervisions.init();
Awards.init();
Publication.init();
});
var tmpMem = 0; var tmpAward = 0; var tmpPub = 0;
// Js For Autocomplete
$('input[name=SearchUser]').autocomplete({
source: function (request, response) {
tmpMem = 0; tmpAward = 0; tmpPub = 0;
$.ajax({
type: 'GET',
url: '#Url.Action("SearchUser", "Profile")',
data: { FirstName: $("#SearchUser").val() },
// url: "/Profile/SearchUser?FirstName=" + $("#SearchUser").val(),
contentType: "application/json; charset=utf-8",
// dataType: "json",
beforeSend: function () {
// code to show loading image
//$(".ui-content").css("opacity", "0.4");
//$("#imgLoader").attr("style", "display:block");
//var df = document.getElementById('imgLoader');
//df.style.position = 'absolute';
//var wd = ($(window).width() / 2) - 45;
//var hg = ($(window).height() / 2) - 60;
//df.style.left = wd + "px";
//df.style.top = hg + "px";
},
complete: function () {
//hide loading image
$(".ui-content").css("opacity", "1.0");
$("#imgLoader").attr("style", "display:none");
},
success: function (data) {
alert(data.data[0].Fname);
response($.map(data.data, function (item) {
return {
Sn: item.Sn, Fname: item.Fname, Mname: item.Uname, Lname: item.Lname, Title: item.Title,
Image: item.Image, Organization: item.Organization, JobTitle: item.JobTitle,
Awardname: item.Awardname, AwardYear: item.AwardYear, Pubname: item.Pubname, Pubtype: item.Pubtype, TabType: item.TabType
}
}))
}
})
},
select: function (event, ui) {
//var domainURL = $("#domainurl").val();
//window.location = domainURL + "/home/NeighborProfile?id=" + ui.item.id;
// alert(ui.item.Sn);
}
}).data("autocomplete")._renderItem = function (ul, item) {
// alert(item);="
if (item.TabType == "member") {
if (tmpMem == 0) {
tmpMem = 1;
return $("<li class='SearchUserLi'></li>").data("item.autocomplete", item).append(
"<a href=' ' class='SearchUserLink'>" +
"<img src='" + item.Image + "' alt='" + item.Fname + "' class='SearchUserImg'>" +
"<span class='searchUserLight'>" +
item.Title + ". " + item.Fname +
"<span style=' font-weight: bold;color:black'>" + " " + item.Organization + "</span>" +
"</span>" +
"<span style=' font-size : 10px; color: #3B5998;'>" + item.JobTitle + "</span>" +
"</a>"
).prepend("<span class='SearchUsercategory'> Members </span>").appendTo(ul);
}
return $("<li class='SearchUserLi'></li>").data("item.autocomplete", item).append(
"<hr class='SearchUserHr'>" +
"<a href=' ' class='SearchUserLink'>" +
"<img src='" + item.Image + "' alt='" + item.Fname + "' class='SearchUserImg'>" +
"<span class='searchUserLight'>" +
item.Title + ". " + item.Fname +
"<span style=' font-weight: bold;color:black'>" + " " + item.Organization + "</span>" +
"</span>" +
"<span style=' font-size : 10px; color: #3B5998;'>" + item.JobTitle + "</span>" +
"</a>"
).appendTo(ul);
}
else if (item.TabType == "award") {
if (tmpAward == 0) {
tmpAward = 1;
return $("<li style='padding:0px!important;height:80px'></li>").data("item.autocomplete", item).append(
"<a href=' ' class='SearchUserLink'>" +
"<img src='" + item.Image + "' alt='" + item.Fname + "' class='SearchUserImg'>" +
"<span class='searchUserLight'>" +
item.Title + ". " + item.Fname +
"<span style=' font-weight: bold;color:black'>" + " " + item.Organization + "</span>" +
"</span>" +
"<span style=' font-size : 10px; color: #3B5998;'>" + " " + item.Awardname + "(" + item.AwardYear + ")" + "</span>" +
"</a>"
).prepend("<span class='SearchUsercategory'> Awards </span>").appendTo(ul)
}
return $("<li style='padding:0px!important;height:80px'></li>").data("item.autocomplete", item).append(
"<hr class='SearchUserHr'>" +
"<a href=' ' class='SearchUserLink'>" +
"<img src='" + item.Image + "' alt='" + item.Fname + "' class='SearchUserImg'>" +
"<span class='searchUserLight'>" +
item.Title + ". " + item.Fname +
"<span style=' font-weight: bold;color:black'>" + " " + item.Organization + "</span>" +
"</span>" +
"<span style=' font-size : 10px; color: #3B5998;'>" + " " + item.Awardname + "(" + item.AwardYear + ")" + "</span>" +
"</a>"
).appendTo(ul);
}
else if (item.TabType == "publications") {
if (tmpPub == 0) {
tmpPub = 1;
return $("<li style='padding:0px!important;height:80px'></li>").data("item.autocomplete", item).append(
"<a href=' ' class='SearchUserLink'>" +
"<img src='" + item.Image + "' alt='" + item.Fname + "' class='SearchUserImg'>" +
"<span class='searchUserLight'>" +
item.Title + ". " + item.Fname +
"<span style=' font-weight: bold;color:black'>" + " " + item.Organization + "</span>" +
"</span>" +
"<span style=' font-size : 10px; color: #3B5998;'>" + " " + item.Pubname + "," + item.Pubtype + "</span>" +
"</a>"
).prepend("<span class='SearchUsercategory'> Publications </span>").appendTo(ul)
}
return $("<li style='padding:0px!important;height:80px'></li>").data("item.autocomplete", item).append(
"<hr class='SearchUserHr'>" +
"<a href=' ' class='SearchUserLink'>" +
"<img src='" + item.Image + "' alt='" + item.Fname + "' class='SearchUserImg'>" +
"<span class='searchUserLight'>" +
item.Title + ". " + item.Fname +
"<span style=' font-weight: bold;color:black'>" + " " + item.Organization + "</span>" +
"</span>" +
"<span style=' font-size : 10px; color: #3B5998;'>" + " " + item.Pubname + "," + item.Pubtype + "</span>" +
"</a>"
).appendTo(ul);
}
};
</script>
After you include jQuery, add the following in a script tag immediately after it. Hope this solves your problem.
jQuery.noConflict();
I'm not sure how your datepicker or autocomplete would work like this. They are both adding functionality to DOM elements when the DOM may not be ready. Try something like this:
<script>
var initFields = function() {
//Date Picker
$('.date-picker').datepicker({
format: 'mm/dd/yyyy'
});
//Autocomplete
var tmpMem = 0; var tmpAward = 0; var tmpPub = 0;
// Js For Autocomplete
$('input[name=SearchUser]').autocomplete({
source: function (request, response) {
tmpMem = 0; tmpAward = 0; tmpPub = 0;
$.ajax({
type: 'GET',
url: '#Url.Action("SearchUser", "Profile")',
data: { FirstName: $("#SearchUser").val() },
// url: "/Profile/SearchUser?FirstName=" + $("#SearchUser").val(),
contentType: "application/json; charset=utf-8",
// dataType: "json",
beforeSend: function () {
// code to show loading image
//$(".ui-content").css("opacity", "0.4");
//$("#imgLoader").attr("style", "display:block");
//var df = document.getElementById('imgLoader');
//df.style.position = 'absolute';
//var wd = ($(window).width() / 2) - 45;
//var hg = ($(window).height() / 2) - 60;
//df.style.left = wd + "px";
//df.style.top = hg + "px";
},
complete: function () {
//hide loading image
$(".ui-content").css("opacity", "1.0");
$("#imgLoader").attr("style", "display:none");
},
success: function (data) {
alert(data.data[0].Fname);
response($.map(data.data, function (item) {
return {
Sn: item.Sn, Fname: item.Fname, Mname: item.Uname, Lname: item.Lname, Title: item.Title,
Image: item.Image, Organization: item.Organization, JobTitle: item.JobTitle,
Awardname: item.Awardname, AwardYear: item.AwardYear, Pubname: item.Pubname, Pubtype: item.Pubtype, TabType: item.TabType
}
}))
}
})
},
select: function (event, ui) {
//var domainURL = $("#domainurl").val();
//window.location = domainURL + "/home/NeighborProfile?id=" + ui.item.id;
// alert(ui.item.Sn);
}
}).data("autocomplete")._renderItem = function (ul, item) {
// alert(item);="
if (item.TabType == "member") {
if (tmpMem == 0) {
tmpMem = 1;
return $("<li class='SearchUserLi'></li>").data("item.autocomplete", item).append(
"<a href=' ' class='SearchUserLink'>" +
"<img src='" + item.Image + "' alt='" + item.Fname + "' class='SearchUserImg'>" +
"<span class='searchUserLight'>" +
item.Title + ". " + item.Fname +
"<span style=' font-weight: bold;color:black'>" + " " + item.Organization + "</span>" +
"</span>" +
"<span style=' font-size : 10px; color: #3B5998;'>" + item.JobTitle + "</span>" +
"</a>"
).prepend("<span class='SearchUsercategory'> Members </span>").appendTo(ul);
}
return $("<li class='SearchUserLi'></li>").data("item.autocomplete", item).append(
"<hr class='SearchUserHr'>" +
"<a href=' ' class='SearchUserLink'>" +
"<img src='" + item.Image + "' alt='" + item.Fname + "' class='SearchUserImg'>" +
"<span class='searchUserLight'>" +
item.Title + ". " + item.Fname +
"<span style=' font-weight: bold;color:black'>" + " " + item.Organization + "</span>" +
"</span>" +
"<span style=' font-size : 10px; color: #3B5998;'>" + item.JobTitle + "</span>" +
"</a>"
).appendTo(ul);
}
else if (item.TabType == "award") {
if (tmpAward == 0) {
tmpAward = 1;
return $("<li style='padding:0px!important;height:80px'></li>").data("item.autocomplete", item).append(
"<a href=' ' class='SearchUserLink'>" +
"<img src='" + item.Image + "' alt='" + item.Fname + "' class='SearchUserImg'>" +
"<span class='searchUserLight'>" +
item.Title + ". " + item.Fname +
"<span style=' font-weight: bold;color:black'>" + " " + item.Organization + "</span>" +
"</span>" +
"<span style=' font-size : 10px; color: #3B5998;'>" + " " + item.Awardname + "(" + item.AwardYear + ")" + "</span>" +
"</a>"
).prepend("<span class='SearchUsercategory'> Awards </span>").appendTo(ul)
}
return $("<li style='padding:0px!important;height:80px'></li>").data("item.autocomplete", item).append(
"<hr class='SearchUserHr'>" +
"<a href=' ' class='SearchUserLink'>" +
"<img src='" + item.Image + "' alt='" + item.Fname + "' class='SearchUserImg'>" +
"<span class='searchUserLight'>" +
item.Title + ". " + item.Fname +
"<span style=' font-weight: bold;color:black'>" + " " + item.Organization + "</span>" +
"</span>" +
"<span style=' font-size : 10px; color: #3B5998;'>" + " " + item.Awardname + "(" + item.AwardYear + ")" + "</span>" +
"</a>"
).appendTo(ul);
}
else if (item.TabType == "publications") {
if (tmpPub == 0) {
tmpPub = 1;
return $("<li style='padding:0px!important;height:80px'></li>").data("item.autocomplete", item).append(
"<a href=' ' class='SearchUserLink'>" +
"<img src='" + item.Image + "' alt='" + item.Fname + "' class='SearchUserImg'>" +
"<span class='searchUserLight'>" +
item.Title + ". " + item.Fname +
"<span style=' font-weight: bold;color:black'>" + " " + item.Organization + "</span>" +
"</span>" +
"<span style=' font-size : 10px; color: #3B5998;'>" + " " + item.Pubname + "," + item.Pubtype + "</span>" +
"</a>"
).prepend("<span class='SearchUsercategory'> Publications </span>").appendTo(ul)
}
return $("<li style='padding:0px!important;height:80px'></li>").data("item.autocomplete", item).append(
"<hr class='SearchUserHr'>" +
"<a href=' ' class='SearchUserLink'>" +
"<img src='" + item.Image + "' alt='" + item.Fname + "' class='SearchUserImg'>" +
"<span class='searchUserLight'>" +
item.Title + ". " + item.Fname +
"<span style=' font-weight: bold;color:black'>" + " " + item.Organization + "</span>" +
"</span>" +
"<span style=' font-size : 10px; color: #3B5998;'>" + " " + item.Pubname + "," + item.Pubtype + "</span>" +
"</a>"
).appendTo(ul);
}
};
};
// var oTable = null;
jQuery(document).ready(function () {
App.init();
PortletDraggable.init();
FormFileUpload.init();
EducationalQualification.init();
WorkExperience.init();
Supervisions.init();
Awards.init();
Publication.init();
initFields();
});
</script>
If that doesn't work, then you may want to check what all JavaScript files you are including to ensure all their versions are compatible, and no two are defining the same functions/objects.
Rather than adding a single Autocomplete script reference, simply add jquery.ui complete bundle script reference. I had a similar problem, but after adding jquery.ui and removing autocomplete scripts, everything started to work fine. Hope it helps
I am developing a blackberry application using html5 code.I need to find my current location and have to show that in Google map.I am running this in BB9780. It is running in simulator but it gives a wrong location(US location). But it is not running in device.
I suspect the below line is not executing.
navigator.geolocation.getCurrentPosition(onSuccess, onError);
I am giving my code here.Please suggest me where I went wrong
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" id="viewport" content="width=device-width,height=device- height,initial-scale=1.0,user-scalable=no">
<script src="json2.js" type="text/javascript"></script>
<script src="cordova-1.7.0.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
// Wait for Cordova to load
document.addEventListener("deviceready", onDeviceReady, false);
// Cordova is ready
function onDeviceReady() {
alert("onDeviceReady");
navigator.geolocation.getCurrentPosition(onSuccess, onError);
}
// onSuccess Geolocation
function onSuccess(position) {
alert("onSuccess");
var element = document.getElementById('geolocation');
element.innerHTML = 'Latitude: ' + position.coords.latitude + '<br />' +
'Longitude: ' + position.coords.longitude + '<br />' +
'Altitude: ' + position.coords.altitude + '<br />' +
'Accuracy: ' + position.coords.accuracy + '<br />' +
'Altitude Accuracy: ' + position.coords.altitudeAccuracy + '<br />' +
'Heading: ' + position.coords.heading + '<br />' +
'Speed: ' + position.coords.speed + '<br />' +
'Timestamp: ' + new Date(position.timestamp) + '<br />';
}
// onError Callback receives a PositionError object
function onError(error) {
alert('code: ' + error.code + '\n' +
'message: ' + error.message + '\n');
}
</script>
<title>Notification Sample</title>
</head>
<body>
<p id="geolocation">Finding geolocation...</p>
</body>
</html>
I dont think its the line you suspect, what is the error message your getting? Its probably the simulator as your code looks correct, though I'm only reading error.message and error.code. This my version of onDeviceReady
function onDeviceReady() {
try {
if(typeof(navigator.geolocation)!='undefined') gl = navigator.geolocation;
else gl=google.gears.factory.create('beta.geolocation');
}catch(e){}
if (gl) {
gl.getCurrentPosition(onSuccess, onError);
alert("Device Ready");
} else {
alert('not supported');
}
}
i get solution by restarting my device
like i am not restarting my device from 1 month
So restart your device may you get solution
please try to add timeout:10000 to see the error log..
it is probably a timeout issue on your specific device
try:
gl.getCurrentPosition(onSuccess, onError,{timeout:10000}); instead
related issue i found on github:
https://github.com/apache/cordova-plugin-geolocation/issues/119#issuecomment-463897045
and here:
phonegap geolocation always fail on timeout