Content Editor JQuery function

I have a table displayed by a web Part with a td section having a class ms-vb2 and inside that td there is a div.
Now i want to make the background color of the div green if th div contains Green. The structure is as below
<td class="ms-vb2"><div>Green</div></td>
for which i have a content editor where i have placed the below code:
$(document).ready(function(){
$('td.ms-vb2').find('div').each(function(){
var cellVal = parseInt($(this).text())
if(String(CellVal) == "Green")
$(this).css("background-color","red");
else
$(this).css("background-color","blue");
<script>
whichdoes not work. Please help

Step through your code. Try to identify where the issue is.
I would remove the if clause and set all divs (irrespective of content) to a set background colour. This will let you know if the rest of the code works and you're wrong in the if statement. If it doesn't work then you've got an error earlier in the selection
process or an error in the css application process.
You do have a javascript debugger in IE, that may be of use to see what's going on.

Similar Messages

How to work JQuery and content editor webpart functionality in sharepoint 2013?

Hi all,
I have a requirement to display the list data in share-point page by using JQuery and content editor web-part. could you please any one suggest the process to display the list data using JQuery and ContentEditorWebpart.
Thanks in advance.
Thanks,
phani kumar
Phani kumar

Hi,
From your description, my understanding is that you want to show a list data in a page using jQuery and Content Query Web Part.
You could use SharePoint REST API to accomplish your requirement, please refer to this code below:
<div id="listData">
</div>
<script src="https://code.jquery.com/jquery-1.11.1.min.js" type="text/javascript"></script><script type="text/javascript">
$(document).ready(function(){
//replace your list title
$.ajax({
url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbytitle('customlist03')/items",
type: "GET",
headers: {"accept": "application/json;odata=verbose"},
success: function (data) {
if (data.d.results) {
var obj = data.d.results;
for(var i = 0; i < obj.length; i++)
$("#listData").append("<div>title "+obj[i].Title+"</div>");
error: function (xhr) {
alert(xhr.status + ': ' + xhr.statusText);
</script>
The screenshot below is my result:
Please refer to these articles:
Working with lists and list items with REST
https://msdn.microsoft.com/en-us/library/office/dn292552.aspx
SharePoint 2013 – CRUD on List Items Using REST Services & jQuery
http://www.plusconsulting.com/blog/2013/05/crud-on-list-items-using-rest-services-jquery/
You can also get list data using JavaScript Client Object Model(JSOM), you could refer to this article:
How to: Complete basic operations using JavaScript library code in SharePoint 2013
https://msdn.microsoft.com/en-us/library/office/jj163201.aspx?f=255&MSPPError=-2147217396
Here is a link about how to add code into page via Content Editor Web Part:
http://blogs.msdn.com/b/sharepointdev/archive/2011/04/14/using-the-javascript-object-model-in-a-content-editor-web-part.aspx
Best Regards,
Vincent Han
TechNet Community Support
Please remember to mark the replies as answers if they help, and unmark the answers if they provide no help. If you have feedback for TechNet Support, contact
[email protected]

Relative Path for Jquery into Content Editor Web Part

Hi;
I'd add a Content Editor Web Part (CEWP) to a web part zone. I'd edit that CEWP in HTML view and add my script which load Jquery and my question : how to use a relative
path for Jquery :
<SharePoint:ScriptLink Name="SP.js" runat="server" OnDemand="true"
Localizable="false" />
<script src="/sites/XXX/Style%20Library/Scripts/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
My code
</script>
Regards

Hi;
Firstly, I have used :
<script src="/Style%20Library/Scripts/jquery.min.js" type="text/javascript"></script>
But any result and any change and If I add /Sites/XXX/ : it works correctly ?
My code is :
<SharePoint:ScriptLink Name="SP.js" runat="server" OnDemand="true"
    Localizable="false" />
<script src="/sites/XXX/Style Library/Scripts/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
ExecuteOrDelayUntilScriptLoaded(displayTitle, "SP.js");
var site;
var context;
function displayTitle() {
    //Get the current client context
    context = SP.ClientContext.get_current();
    //Add the site to query queue
    site = context.get_web();
    context.load(site);
    //Run the query on the server
    context.executeQueryAsync(onQuerySucceeded, onQueryFailed);
function onQueryFailed(sender, args) {
alert('request failed ' + args.get_message() +
    '\n' + args.get_stackTrace());
function onQuerySucceeded(sender, args) {
    $("#layoutsTable table th span").html("Bienvenue sur le site " + site.get_title() + " - Direction Technique");
   $("#zz17_V4QuickLaunchMenu ul.root li span:contains('Biblioth')").parent().parent().hide();
   $("#zz17_V4QuickLaunchMenu ul.root li span:contains('Listes')").parent().parent().hide();
</script>

Uploading multiple documents into sharepoint list item with REST in sharepoint 2013 using content editor web part :

hi ,
i am trying to upload multiple document files into sharepoint list item. I followed below link for implementaion.
http://techfindings-prem.blogspot.in/search/label/jquery.multifilejs
It was working for sharepoint hosted app.
This complete code is written within content edito web part.
It was working when i was in root site collection with below change (hard coded the root level url) in code in "UploadFile" function.
var scriptbase = "http://servername" + "/_layouts/15/";
console.log(' File size:' + bytes.length);
$.getScript(scriptbase + "SP.RequestExecutor.js", function () {
var createitem = new SP.RequestExecutor("http://servername");
createitem.executeAsync({
url: "http://servername/sites/cpg/" + "/_api/web/lists/GetByTitle('SalesRecord')/items(" + attachmentitemid + ")/AttachmentFiles/add(FileName='"
+ fileName + "')",
method: "POST",
binaryStringRequestBody: true,
body: binary,
success: fsucc,
error: ferr,
state: "Update"
function fsucc(data) {
//alert( data.statusText + "\n\n" + data.responseText);
console.log(data + ' uploaded successfully');
deferred.resolve(data);
function ferr(data) {
//alert( data.statusText + "\n\n" + data.responseText);
console.log(fileName + "not uploaded error");
deferred.reject(data);
But the issue came in picture when i was working with the other site collection instead of root one. The url was like below.
"http://servername/sites/cpg/". This time i need to be there within "cpg" site collection.
Now if i hard code the url as i did above my code gets break here while come to below line
$.getScript(scriptbase + "SP.RequestExecutor.js", function () {
I am getting error when i used below code:
var scriptbase = "http://servername" + "/_layouts/15/";
$.getScript(scriptbase + "SP.RequestExecutor.js", function () {
var createitem = new SP.RequestExecutor("http://servername");
createitem.executeAsync({
url: "http://servername/sites/cpg/" + "/_api/web/lists/GetByTitle('SalesRecord')/items(" + attachmentitemid + ")/AttachmentFiles/add(FileName='"
+ fileName + "')",
method: "POST",
binaryStringRequestBody: true,
body: binary,
success: fsucc,
error: ferr,
state: "Update"
function fsucc(data) {
//alert( data.statusText + "\n\n" + data.responseText);
console.log(data + ' uploaded successfully');
deferred.resolve(data);
function ferr(data) {
//alert( data.statusText + "\n\n" + data.responseText);
console.log(fileName + "not uploaded error");
deferred.reject(data);
Please hekp in this case. This complete code is written within content edito web part.
Regards:
Sanjay Joshi

Hi,
According to your post, my understanding is that you have an issue about upload multiple documents files into library vai REST API.
As you have said, you have used the hard code url in your code.
How about use the _spPageContextInfo.webAbsoluteUrl method to get the url?
I have used this method to get the url, then use the code in the article you have pasted within a content editor web part to upload the files.
You can replace the hard code url with the _spPageContextInfo.webAbsoluteUrl method, then check whether it works.
Thanks,
Jason
Jason Guo
TechNet Community Support

Disable link for a Image in Content editor web part

Hi
i want to disable hyperlink for a banner added using content editor web part. Instead of hiding using Target Audience, i want to disable the link.
Please help me how can i achieve this?
regards,
Vinay
Thanks and Regards, vinnu

Hi Vinay,
I recommend to disable the link for an image using Jquery in Content Editor web part.
First, you need to use F12 tool in Internet Explorer(IE) to get the html tag for the image, and you’d better find the class or id value for the tag of the image.
For example, if the class for the image is test, then the code should be:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript">
$('.test').click(function(e) {
e.preventDefault();
</script>
You can also paste the code of the image here for further research.
Best regards.
Thanks
Victoria Xia
TechNet Community Support

SharePoint 2013 Client Side People Picker in Content Editor Web Part

Has anyone tried to use the client side people picker in a content editor web part? I have successfully got it to work in IE by adding all the script references and initialize function to the content editor web part. Now the strange part is, the people
picker doesn't render in other browsers, I tried in Chrome, Safari, and Firefox. Any ideas?

Below can be used to create people picker in CEWP
<asp:content contentplaceholderid="PlaceHolderAdditionalPageHead" runat="server">
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.2.min.js" type="text/javascript"></script>
<script type="text/javascript" src="../Apps/_layouts/15/clienttemplates.js"></script>
<script type="text/javascript" src="../Apps/_layouts/15/clientforms.js"></script>
<script type="text/javascript" src="../Apps/_layouts/15/clientpeoplepicker.js"></script>
<script type="text/javascript" src="../Apps/_layouts/15/autofill.js"></script>
<script type="text/javascript" src="../Apps/_layouts/15/sp.js"></script>
<script type="text/javascript" src="../Apps/_layouts/15/sp.runtime.js"></script>
<script type="text/javascript" src="../Apps/_layouts/15/sp.core.js"></script>
<script type="text/javascript">

<link rel="Stylesheet" type="text/css" href="../SiteAssets/PeoplePicker/App.css"/>

// Run your custom code when the DOM is ready.
$(document).ready(function () {
// Specify the unique ID of the DOM element where the
// picker will render.
initializePeoplePicker('peoplePickerDiv');
// Render and initialize the client-side People Picker.
function initializePeoplePicker(peoplePickerElementId) {
// Create a schema to store picker properties, and set the properties.
var schema = {};
schema['PrincipalAccountType'] = 'User,DL,SecGroup,SPGroup';
schema['SearchPrincipalSource'] = 15;
schema['ResolvePrincipalSource'] = 15;
schema['AllowMultipleValues'] = true;
schema['MaximumEntitySuggestions'] = 50;
schema['Width'] = '280px';
// Render and initialize the picker.
// Pass the ID of the DOM element that contains the picker, an array of initial
// PickerEntity objects to set the picker value, and a schema that defines
// picker properties.
this.SPClientPeoplePicker_InitStandaloneControlWrapper(peoplePickerElementId, null, schema);
// Query the picker for user information.
function getUserInfo() {
// Get the people picker object from the page.
var peoplePicker = this.SPClientPeoplePicker.SPClientPeoplePickerDict.peoplePickerDiv_TopSpan;
// Get information about all users.
var users = peoplePicker.GetAllUserInfo();
var userInfo = '';
for (var i = 0; i < users.length; i++) {
var user = users[i];
for (var userProperty in user) {
userInfo += userProperty + ': ' + user[userProperty] + '<br>';
$('#resolvedUsers').html(userInfo);
// Get user keys.
var keys = peoplePicker.GetAllUserKeys();
$('#userKeys').html(keys);
</script>
</asp:content>
<asp:content contentplaceholderid="PlaceHolderMain" runat="server">
<div id="peoplePickerDiv"></div>
<div>
<br/>
<input type="button" value="Get User Info" onclick="getUserInfo()"></input>
<br/>
<h1>User info:</h1>
<p id="resolvedUsers"></p>
<h1>User keys:</h1>
<p id="userKeys"></p>
</div>
</asp:content>
Vishnu

Add Tab ability to Content Editor Web Part

Just wondering if there is an easy way to add a content editor Webpart to a SharePoint Online (office 365) SharePoint site where the code in the CEWP would created 2 tabs and the user could then put different content to display on each tab. When a
user clicks the other tab, the CEWP switches to that content.
Thanks!

Hi,
According to your description, my understanding is that you want to create a tab and when switch the tab to display different content in SharePoint Online site.
I suggest you can use Jquery API tabs plugin to achieve it. You can add a content editor web part and then add Jquery code in it.
Here is a code snippert for your reference:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Tabs - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
$( "#tabs" ).tabs();
</script>
</head>
<body>
<div id="tabs">
<ul>
<li><a href="#tabs-1">Nunc tincidunt</a></li>
<li><a href="#tabs-2">Proin dolor</a></li>
<li><a href="#tabs-3">Aenean lacinia</a></li>
</ul>
<div id="tabs-1">
<p>Test1</p>
</div>
<div id="tabs-2">
<p>Test2</p>
</div>
<div id="tabs-3">
<p>Test3</p>
</div>
</div>
</body>
</html>
More information for your reference:
Jquery Tabs
Thanks
Best Regards
Forum Support
Please remember to mark the replies as answers if they help and unmark them if they provide no help. If you have feedback for TechNet Subscriber Support, contact [email protected]
Jerry Guo
TechNet Community Support

In-content Editor image keeping ?action=thumbnail

Hello all,
I've been working on a few BC projects now and found the '?action=thumbnail&width=600&height=300&algorithm=fill_proportional' that you can add onto images really useful in helping keep site design - mainly it means clients do not need to upload images with exact dimensions to keep things consistent.
However, when you add the In-content Editor attribute 'ice:editable="image"' and replace the image via the front end Edit screen the '?action=thumbnail&width=600&height=300&algorithm=fill_proportional' will be removed from the image's path and therefore break design / consistency. Is there anyway to stop this from happening?
Regards,
Mat

Hi Vinay,
I recommend to disable the link for an image using Jquery in Content Editor web part.
First, you need to use F12 tool in Internet Explorer(IE) to get the html tag for the image, and you’d better find the class or id value for the tag of the image.
For example, if the class for the image is test, then the code should be:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript">
$('.test').click(function(e) {
e.preventDefault();
</script>
You can also paste the code of the image here for further research.
Best regards.
Thanks
Victoria Xia
TechNet Community Support

Script not working in SharePoint content editor webpart

Hi All,
<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function () {
//Call your function here like
//retrieveListItems();
ExecuteOrDelayUntilScriptLoaded(retrieveListItems, "SP.js");
var siteUrl = '/vceo/PMO/EPMO/';
var close1 = ''; var close2 = ''; var high = ''; var low = ''; var medium = ''; var lowMedium = ''; var mediumHigh = '';
var open1 = ''; var open2 = ''; var high1 = ''; var low1 = ''; var medium1 = ''; var lowMedium1 = ''; var mediumHigh1 = '';
var count = 0; var count1 = 0;
var initiate = 0; var planning = 0; var execution = 0; var closing = 0;
var sumMinimal = 0; var sumModerate = 0; var sumCritical = 0; var sumSevere = 0;
var sumHighlyLikely = 0; var sumLikely = 0; var sumSomewhat = 0; var sumUnlikely = 0;
var sumBudget = 0; var sumCommitted = 0; var sumConsumption = 0;
function retrieveListItems() {
alert("Welcome to Dashboard");
var clientContext = new SP.ClientContext(siteUrl); alert("site url");
var oList = clientContext.get_web().get_lists().getByTitle('Project Issues and Risks');
var oList1 = clientContext.get_web().get_lists().getByTitle('Project');
var oList2 = clientContext.get_web().get_lists().getByTitle('Risk Impact');
var oList3 = clientContext.get_web().get_lists().getByTitle('Risk Probability'); alert("get by title");
var camlQuery = new SP.CamlQuery(); var camlQuery1 = new SP.CamlQuery(); var camlQuery2 = new SP.CamlQuery(); var camlQuery3 = new SP.CamlQuery(); var camlQuery4 = new SP.CamlQuery(); var camlQuery5 = new SP.CamlQuery(); var camlQuery6 = new SP.CamlQuery();
camlQuery.set_viewXml('<View><Query><Where><Eq><FieldRef Name="Project_x0020_Issue_x0020_Status" /><Value Type="Choice">Issue</Value></Eq></Where></Query></View>');
camlQuery1.set_viewXml('<View><Query><Where><Eq><FieldRef Name="Project_x0020_Issue_x0020_Status" /><Value Type="Choice">Risk</Value></Eq></Where></Query></View>');
camlQuery2.set_viewXml('<View><Query><Where><Eq><FieldRef Name="Overall_x0020_Status" /><Value Type="Choice">Open</Value></Eq></Where></Query></View>');
camlQuery3.set_viewXml('<View><Query><Where><Eq><FieldRef Name="Overall_x0020_Status" /><Value Type="Choice">Closed</Value></Eq></Where></Query></View>');
camlQuery4.set_viewXml('<View><Query><Where><IsNotNull><FieldRef Name="Project_x0020_Code" /></IsNotNull></Where></Query></View>');
camlQuery5.set_viewXml('<View><Query><Where><IsNotNull><FieldRef Name="Project_x0020_Code" /></IsNotNull></Where></Query></View>');
camlQuery6.set_viewXml('<View><Query><Where><IsNotNull><FieldRef Name="Project_x0020_Code" /></IsNotNull></Where></Query></View>');
this.collListItem = oList.getItems(camlQuery); this.collListItem1 = oList.getItems(camlQuery1); this.collListItem2 = oList1.getItems(camlQuery2); this.collListItem3 = oList1.getItems(camlQuery3);
this.collListItem4 = oList2.getItems(camlQuery4); this.collListItem5 = oList3.getItems(camlQuery5); this.collListItem6 = oList1.getItems(camlQuery6);
clientContext.load(collListItem); clientContext.load(collListItem1); clientContext.load(collListItem2); clientContext.load(collListItem3); clientContext.load(collListItem4); clientContext.load(collListItem5); clientContext.load(collListItem6);
clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));
alert("retrieve list");
function onQuerySucceeded(sender, args) {
alert("succeed");
var listItemEnumerator = collListItem.getEnumerator(); var listItemEnumerator1 = collListItem1.getEnumerator(); var listItemEnumerator2 = collListItem2.getEnumerator();
var listItemEnumerator3 = collListItem3.getEnumerator(); var listItemEnumerator4 = collListItem4.getEnumerator(); var listItemEnumerator5 = collListItem5.getEnumerator(); var listItemEnumerator6 = collListItem6.getEnumerator();
var sumClose = 0; var sumClose1 = 0; var sumHigh = 0; var sumMedium = 0; var sumLow = 0; var sumLowMedium = 0; var sumMediumHigh = 0;
var sumOpen = 0; var sumOpen1 = 0; var sumHigh1 = 0; var sumMedium1 = 0; var sumLow1 = 0; var sumLowMedium1 = 0; var sumMediumHigh1 = 0;
while (listItemEnumerator.moveNext()) { var oListItem = listItemEnumerator.get_current(); sumClose += oListItem.get_item('Close'); sumOpen += oListItem.get_item('Open'); sumHigh += oListItem.get_item('High'); sumMedium += oListItem.get_item('Medium'); sumLow += oListItem.get_item('Low'); sumLowMedium += oListItem.get_item('LowMedium'); sumMediumHigh += oListItem.get_item('MediumHigh'); }
while (listItemEnumerator1.moveNext()) { var oListItem1 = listItemEnumerator1.get_current(); sumClose1 += oListItem1.get_item('Close'); sumOpen1 += oListItem1.get_item('Open'); sumHigh1 += oListItem1.get_item('High'); sumMedium1 += oListItem1.get_item('Medium'); sumLow1 += oListItem1.get_item('Low'); sumLowMedium1 += oListItem1.get_item('LowMedium'); sumMediumHigh1 += oListItem1.get_item('MediumHigh'); }
while (listItemEnumerator4.moveNext()) { var oListItem4 = listItemEnumerator4.get_current(); sumMinimal += oListItem4.get_item('Minimal'); sumModerate += oListItem4.get_item('Moderate'); sumSevere += oListItem4.get_item('Severe'); sumCritical += oListItem4.get_item('Critical'); }
while (listItemEnumerator5.moveNext()) { var oListItem5 = listItemEnumerator5.get_current(); sumUnlikely += oListItem5.get_item('Unlikely'); sumSomewhat += oListItem5.get_item('Somewhat'); sumLikely += oListItem5.get_item('Likely'); sumHighlyLikely += oListItem5.get_item('HighlyLikely'); }
while (listItemEnumerator6.moveNext()) { var oListItem6 = listItemEnumerator6.get_current(); sumBudget += oListItem6.get_item('Project_x0020_Budget_x0020_Amoun'); sumCommitted += oListItem6.get_item('Committed_x0020_Budget'); }
count = this.collListItem2.get_count();
count1 = this.collListItem3.get_count();
while (listItemEnumerator2.moveNext()) {
var oListItem2 = listItemEnumerator2.get_current();
var stat = oListItem2.get_item('Project_x0020_Status');
if (stat == "Intiation") {
initiate = initiate + 1
if (stat == "Planning") {
planning = planning + 1
if (stat == "Execution") {
execution = execution + 1
if (stat == "Closing") {
closing = closing + 1
//alert("initiate" + initiate); alert("planning" + planning); alert("execution" + execution); alert("closing" + closing);
//alert("countOpen" + count); alert("closed:" + count1);
window.close1 = sumClose; window.close2 = sumClose1; window.high = sumHigh; window.low = sumLow; window.medium = sumMedium; window.mediumHigh = sumMediumHigh; window.lowMedium = sumLowMedium;
window.open1 = sumOpen; window.open2 = sumOpen1; window.high1 = sumHigh1; window.low1 = sumLow1; window.medium1 = sumMedium1; window.mediumHigh1 = sumMediumHigh1; window.lowMedium1 = sumLowMedium1;
drawChart();
function onQueryFailed(sender, args) { alert('Request failed.. ' + args.get_message() + '\n' + args.get_stackTrace()); }
google.load("visualization", "1", { packages: ["corechart"] });
function drawChart() {
var data = google.visualization.arrayToDataTable([['Task', 'Issues'], ['Close', window.close1], ['Open', window.open1]]);
var data1 = google.visualization.arrayToDataTable([['Task', 'Risks'], ['Close', window.close2], ['Open', window.open2]]);
var data2 = google.visualization.arrayToDataTable([['Program', 'High', 'Medium-High', 'Medium', 'Low-Medium', 'Low'], ['Category', window.high, window.mediumHigh, window.medium, window.lowMedium, window.low]]);
var data3 = google.visualization.arrayToDataTable([['Program', 'High', 'Medium-High', 'Medium', 'Low-Medium', 'Low'], ['Category', window.high1, window.mediumHigh1, window.medium1, window.lowMedium1, window.low1]]);
var data4 = google.visualization.arrayToDataTable([['Project', 'Status'], ['Closed', count1], ['Open', count]]);
var data5 = google.visualization.arrayToDataTable([['Project', 'Status'], ['Initiation', initiate], ['Planning', planning], ['Execution', execution], ['Closing', closing]]);
var data6 = google.visualization.arrayToDataTable([['Program', 'Impact'], ['Minimal', sumMinimal], ['Moderate', sumModerate], ['Severe', sumSevere], ['Critical', sumCritical]]);
var data7 = google.visualization.arrayToDataTable([['Program', 'Probability'], ['Highly Likely/Probable(76%-100%)', sumHighlyLikely], ['Likely(51%-76%)', sumLikely], ['Somewhat Likely(26%-50%)', sumSomewhat], ['Unlikely/Improbable(0%-25%)', sumUnlikely]]);
var data8 = google.visualization.arrayToDataTable([['Project', 'Budget'], ['Approved', sumBudget], ['Committed', sumCommitted]]);
var options = { title: 'Program Issues', width: 200, height: 300, legend: 'bottom', pieSliceText: 'value', pieStartAngle: 180, };
var options1 = { title: 'Program Risks', width: 200, height: 300, legend: 'bottom', pieSliceText: 'value', pieStartAngle: 180, };
var options2 = { width: 200, height: 200, legend: { position: 'top', maxLines: 3 }, bar: { groupWidth: '25%' }, isStacked: true, vAxis: { title: 'Open', titleTextStyle: { color: 'red' } } };
var options3 = { width: 200, height: 200, legend: { position: 'top', maxLines: 3 }, bar: { groupWidth: '25%' }, isStacked: true, vAxis: { title: 'Open', titleTextStyle: { color: 'red' } } };
var options4 = { title: 'Project Status', width: 225, height: 300, legend: 'bottom', pieSliceText: 'value', pieStartAngle: 180, };
var options5 = { width: 175, height: 200, legend: { position: 'top', maxLines: 10 }, pieSliceText: 'value', };
var options6 = { title: 'Program Risk Impact', width: 300, height: 300, legend: 'right', pieSliceText: 'value', };
var options7 = { title: 'Program Risk Probable', width: 300, height: 300, legend: 'right', pieSliceText: 'value', };
var options8 = { title: 'Project Budget', width: 300, height: 300, legend: 'bottom', pieSliceText: 'value', };
var chart = new google.visualization.PieChart(document.getElementById('chart_div3'));
chart.draw(data, options);
var chart1 = new google.visualization.PieChart(document.getElementById('chart_div'));
chart1.draw(data1, options1);
var chart2 = new google.visualization.ColumnChart(document.getElementById('chart_div1'));
chart2.draw(data2, options2);
var chart3 = new google.visualization.ColumnChart(document.getElementById('chart_div2'));
chart3.draw(data3, options3);
var chart4 = new google.visualization.PieChart(document.getElementById('chart_div4'));
chart4.draw(data4, options4);
var chart5 = new google.visualization.PieChart(document.getElementById('chart_div5'));
chart5.draw(data5, options5);
var chart6 = new google.visualization.PieChart(document.getElementById('chart_div6'));
chart6.draw(data6, options6);
var chart7 = new google.visualization.PieChart(document.getElementById('chart_div7'));
chart7.draw(data7, options7);
var chart8 = new google.visualization.ColumnChart(document.getElementById('chart_div8'));
chart8.draw(data8, options8);
</script>
</head>
<body>
<table >
<tbody>
<tr>
<td id="chart_div8" colspan="2" style="border-bottom:ridge;border-left:ridge;border-top:ridge"></td>
<td id="chart_div4" style="border-bottom:ridge;border-left:ridge;border-top:ridge"></td>
<td id="chart_div5" style="border-bottom:ridge;border-right:ridge;border-top:ridge"></td>
</tr>
<tr>
<td id="chart_div" style="border-bottom:ridge;border-left:ridge;"></td>
<td id="chart_div2" style="border-bottom:ridge;"></td>
<td id="chart_div3" style="border-bottom:ridge;border-left:ridge;"></td>
<td id="chart_div1" style="border-bottom:ridge;border-right:ridge""></td>
</tr>
<tr>
<td id="chart_div6" colspan="2" style="border-bottom:ridge;border-left:ridge;"></td>
<td id="chart_div7" colspan="2" style="border-bottom:ridge;border-left:ridge;border-right:ridge"></td>
</tr>
</tbody>
</table>
</body>
</html>
This content editor webpart not working in sharepoint page. Once I checked out to the page then chart is working. When i checkedin function not get called. How to fix this?
THanks in advance!

In SharePoint 2013, sp.js and sp.runtime.js does not load on the page in published mode. You need to explicitly load these files. You can check using IE developer tools in the Script section that in published mode these files are missing.
In order to fix this issue explictly refer these two js files on your page.
<script type="text/javascript" src="_layouts/15/sp.runtime.js"></script>
<script type="text/javascript" src="_layouts/15/sp.js"></script>
Geetanjali Arora | My blogs |

Javascript with window.location.href no longer working in Content Editor in Sharepoint 2010 where users have IE8

I have recently found that when using a Sharepoint 2010 Content Editor web part to house some Javascript that the window.location.href (or window.location) is not working when the end users have IE8 installed on their PC's. We have confirmed
that the window.location.href is working if the users are on IE7 or Google Chrome with the same Javascript. In addition, we added alert() to the javascript to ensure that it was infact running, which the alerts appeared on the screen with no issues.
The result that I am receiving in IE8 is that when the window.location.href is set to the url that the user should be directed to, it simply refreshes the current page and leaves the user where they originally were.
I have seen the posts to have my site setup as a Trusted Site, but this is not an option for our company as they defined all internal Sharepoint sites as trusted already. Besides this, having all users go into their Internet Options is not really a
solution but a means to annoy your users.
What I am looking for is a permanent solution that I can make within my javascript that will work for both IE7 and IE8 users within a Sharepoint 2010 environment. If anyone has any suggestions, please let me know. Thanks in advance.
Below is a snipet from my javascript code for review:
<script type="text/javascript">
function RedirectUrl() {
alert('button pressed');
var tb = document.getElementById("tbSearch").value;
var cs = document.getElementById("sfield").value;
var url = "";
if (tb != "") {
url = "FilterName=" + cs + "&FilterMultiValue=*" + tb + "*";
if (cs == "Request%5Fx0020%5FID1"){
alert("Request%20ID%20Search.aspx?" + url)
window.location.href = "Request%20ID%20Search.aspx?" + url;
else {
window.location.href = "All%20Requests.aspx?" + url;
else {
return false;
function ClearUrl() {
window.location.href = "All%20Requests.aspx";
</script>
<br/>
<span style="font-family: calibri; color: #000066; font-size: 14pt; font-weight: bold">Search</span>
<br/>
<span style="font-family: calibri; color: black">Search Field: </span>
<select id="sfield" style="font-family: calibri; font-size: 10pt">
<option value="Request%5Fx0020%5FID1">Request ID</option>
</select>  
<span style="font-family: calibri; color: black">Search Text: </span>
<input id="tbSearch" onkeypress="if (event.keyCode == 13) document.getElementById('btnSearch').click()" style="font-family: calibri"/>
<button id="btnSearch" onclick="return RedirectUrl();" type="submit" style="font-family: calibri">Search</button>
<button id="btnClear" onclick="return ClearUrl();" type="submit" style="font-family: calibri">Clear Search</button>
<br/>
<br/>
<span style="font-family: calibri; color: #000066; font-size: 14pt; font-weight: bold">Search Results - All Requests</span>
<br/>

Hi,
According to your post, my understanding is that the window.location.href not worked in IE 8.
I think the issue
is likely due to the value of your variables. If they contain special or invalid characters, those needs to be passed through
encodeURIComponent before being assigned to window.location.href.
http://stackoverflow.com/questions/18278777/window-location-href-not-working-on-ie
http://stackoverflow.com/questions/6297291/window-location-problem-in-ie
You can also use the following methods to check whether it works.
Window.navigate();
Winodw.history.back();
Self.location.href;
Top.location;
Thanks & Regards,
Jason
Jason Guo
TechNet Community Support

How do you create a popup in sharepoint within a content editor?

I need to create a popup in sharepoint 2007 by clicking on a link within a content editor.
thanks

Hi,
In SP 2010, Select Contents in CEWP, Format--> Html Source in the ribbon,
Add the javacript code
<script type="text/javascript">
     function OpenDialog(URL) {
         var NewPopUp = SP.UI.$create_DialogOptions();
         NewPopUp.url = URL;
         NewPopUp.width = 700;
         NewPopUp.height = 350;
        SP.UI.ModalDialog.showModalDialog(NewPopUp);
script>
<a onlick=”javascript:OpenDialog(‘/sites/alr/SitePages/Reservation.aspx’)” >Show</a>-To
Make it Server relative.
So that Dialog box opens anywhere in site collection
Regards, Sreekanth Reddy M

Can't place images in Joomla 1.5 content editor

Since upgrading to FF3.6.10, when placing an image in content editor in Joomla 1.5 website(s) the image is not placed and only a short section of code is visible in the html view after completing task as below;
..(img border="0" /)
Reverting to earlier version of FF resolves this and everything works normally, testing the same function of other editors is satisfactory and images place correctly.
Not sure if this error is relative, but was displayed when the problem was noticed.
Error: Async statement execution returned with '11', 'database disk image is malformed'
Source File: file:///Applications/Firefox.app/Contents/MacOS/components/nsPlacesDBFlush.js
Line: 312

Copy and Paste this code in the Code field in the "Tools > Error Console" and click the "Evaluate" button to cleanup and compress the places.sqlite database file.
<pre><nowiki>Components.utils.import("resource://gre/modules/PlacesDBUtils.jsm");PlacesDBUtils.checkAndFixDatabase();</nowiki></pre>
If that gives the same error then see http://kb.mozillazine.org/Locked_or_damaged_places.sqlite

Creating a persistent check box in a Content Editor Web Part

I'm using the following HTML in a Content Editor Web Part to display a check box. It works great, but how can I make the checkbox state persistent? (i.e, it remembers whether it is checked or not between sessions).
HTML: <input name="Completed" type="checkbox" value="Completed" />

Hi
Adoukusa ,
For creating a persistent check box in a Content Editor Web Part, you need to use cookie to store the state of the checkbox and maintain the state by reading / writing cookies.
Here is JavaScript cookie sample code:
function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
else var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
function readCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
return null;
function eraseCookie(name) {
createCookie(name,"",-1);
Reference:
http://stackoverflow.com/questions/1154258/persistence-of-checkbox-values
Best Regards,
Eric
Eric Tao
TechNet Community Support

Since installing 3.6.9 my Joomla content editor pop-up windows no longer return the URLs selected

I recently upgraded to Firefox 3.6.9 and found that when using the editor in a Joomla 1.0.15 website , the content editor pop-up windows no longer return URLs selected (eg: image or file URL to be used in a link). I have been using the site with no problems for many years, and the problem was cured when I reinstalled 3.6.8

Thanks cor-el but the problem is not in my web development but is a new issue/problem in FireFox which was not present in all versions up to and including version 3.6.8 and was only introduced in version 3.6.9. I have also established that the same problem also exists in FireFox version 4 beta 6 and have therefore also raised a second question today.
My understanding was that I should raise these issues in this forum, but I will also check out the other forum.

JQuery function stops working when trying to submit large amount of parameters

Hi,
Run CF9 on Windows 2008 R2 Server.
I have a cfm page with multiple dropdowns (some are cfselect) and dynamically generated lists of checkboxes interdependent on each other. I am using JQuery to submit data to cfc functions and to display data.
It was all working fine until we added new company with large number of records. This translated into large URL query string with a lot of parameters submitted for processing. That's when we started to have problems. I noticed when trying to directly submitting URL, if the total number of characters in URL is more than 2114 I get an error status code 302 Redirect and nothing is displayed.
I tried to play with postParametersLimit and postSizeLimit increasing to 1000.0 in neo-runtime.xml and restarting server but, this did not help.
Below is jquery function:
function populateBills(){
   var plID;
   if ($('#planenrolldate_id').val() == undefined)
    plID = $('input[name=planenrolldate_id]').val();
   else
    plID = $('#planenrolldate_id').val();
   var sID = $('#sponsor_id').val();
   var pID = $('#plan_id').val();
   var fromMonth = $('#from_month').val();
   var fromYear = $('#from_year').val();
   var toMonth = $('#to_month').val();
   var toYear = $('#to_year').val();
   $.ajax({
    type:"POST",
    url:"../components/billing/custompremstatus.cfc?method=GetBillsArr&planenrolldate_id=" + plID + "&sponsorid=" + sID + "&fM=" + fromMonth + "&fY=" + fromYear + "&tM=" + toMonth + "&tY=" + toYear,
    dataType: "json",
    success:
     function(data){
      $.each(data, function(index, item) {
       addBillsCheckboxes(item.bill_id,item.bill_period);
    }, //end the error function
    error:
     function(){
      alert("An error has occurred while fetching bills");
     } //end the error function
   }); // end ajax call
} // end of function

That's exactly from the console after I submit:
fM 9
fY 2014
method GetBillsArr
planenrolldate_id[] 564
planenrolldate_id[] 561
sponsor_id 59
tM 9
tY 2014
When I check just one planenrolldate_id then it looks like this
fM 9
fY 2014
method GetBillsArr
planenrolldate_id[] 561
sponsor_id 59
tM 9
tY 2014
This it cfc part:
<cffunction name="GetBillsArr" access="remote" returnFormat="json" returnType="array">
        <cfargument name="sponsor_id" type="any" required="true">
        <cfargument name="planenrolldate_id" type="any" required="true">
        <cfargument name="fM" type="numeric" required="true">
        <cfargument name="fY" type="numeric" required="true">
        <cfargument name="tM" type="numeric" required="true">
        <cfargument name="tY" type="numeric" required="true">
        <cfset var result=ArrayNew(1)>
        <cfset var i = 0>
         <cfif ARGUMENTS.planenrolldate_id EQ "" OR ARGUMENTS.sponsor_id EQ "">
            <cfset LstBills = QueryNew("bill_id, bill_period", "Integer, Varchar")>
        <cfelse>
            <cfquery name="LstBills" ...>
                SELECT bill_id,
                    (Convert(varchar(10),billing_start_date,103) + ' - ' + Convert(varchar(10),billing_end_date,103)) + ' [' + Convert(varchar(6),plan_id) + ']' AS bill_period
                    FROM ...
            </cfquery>
        </cfif>
        <cfloop query="LstBills">
            <cfset returnStruct = StructNew()>
            <cfset returnStruct["bill_id"]= bill_id>
             <cfset returnStruct["bill_period"] = bill_period>
             <cfset ArrayAppend(result,returnStruct) />
        </cfloop>
        <cfreturn result>
</cffunction>

Content Editor JQuery function

Similar Messages

Maybe you are looking for