Take the 2-minute tour ×
SharePoint Stack Exchange is a question and answer site for SharePoint enthusiasts. It's 100% free, no registration required.

I have to fetch data using javascript client object model and for that i have to use Sharepoint Designer 2010 only i have searched on google and there i got solution only by adding code in visual web part. So can any tell me how i can use javascript client object mode to retrieve data in sharepoint designer 2010?

share|improve this question
add comment

4 Answers 4

up vote 1 down vote accepted

Here take a look at this. I completely deleted my original answer. Now below make sure in your script type that it is just like below.

    <script type="text/ecmascript" src="/_layouts/SP.Core.js" />
     <script type="text/ecmascript" src="/_layouts/SP.Debug.js" />
       <script type="text/ecmascript" src="/_layouts/SP.Runtime.Debug.js" />

      <script language="ecmascript" type="text/ecmascript">

      function onQuerySucceeded(sender, args) {
          alert('Title: ' + this.oWebsite.get_title() + ' Decription: ' +   this.oWebsite.get_description());
      }

      function onQueryFailed(sender, args) {
          alert('request failed ' + args.get_message() + '\n' +    args.get_stackTrace());
      }

      function retrieveWebSite() {
          var clientContext = new SP.ClientContext.get_current();
          this.oWebsite = clientContext.get_web();
          clientContext.load(this.oWebsite);
          clientContext.executeQueryAsync(Function.createDelegate(this,   this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));
      }
  </script>

Make sure you have the libraries loaded. Look here

http://msdn.microsoft.com/en-us/library/ee535709.aspx

http://msdn.microsoft.com/en-us/library/hh185009.aspx

First link is how to setup your application page the second link is how to perform a simple list lookup function.

share|improve this answer
    
Make sure that you add your scripts in the HeadPlacement content holder –  Joseph D Surgeon Oct 8 '12 at 13:26
    
do i compulsory have use this way.....can't i use javascript client object model?? –  Stark Oct 8 '12 at 13:36
    
Check the updated answer –  Joseph D Surgeon Oct 8 '12 at 13:51
    
i hate tried the js code but when i put try catch in the function i got the error :- Object doesn't support this action –  Stark Oct 9 '12 at 12:44
    
If you notice the script type is not javascript i is ecma scripting thats why you may be getting Object doesn't suppot this action. Also open the page using IE and hit F12 to make sure you don't have any syntax errors. –  Joseph D Surgeon Oct 9 '12 at 13:07
add comment

Think of the visual web part as a container. You can implement this code in a couple different ways using only SPD:

  1. Open the page in advanced mode in SPD and enter the script just as you would a plain old web page. I would put the script inside the PlaceHolderMain control as SharePoint is a little picky about where to put javascript.

  2. Put the script in a content editor web part right in the web interface.

  3. (recommended) Create a separate javascript file for your code. Reference it in a script tag either on your page, or on the master page.

share|improve this answer
    
BTW I share your frustration with the visual web part examples. I mean who in the real world deploys a user control to the farm just to add in some javascript? –  Derek Gusoff Oct 8 '12 at 17:39
    
i have tried as per your suggestion but i am not getting any result...even created function is not called after putting the COM code...so can you please provide an example for little more guidance –  Stark Oct 9 '12 at 6:08
    
Joseph Surgeon has already done that. Look at the second link he posted. –  Derek Gusoff Oct 9 '12 at 14:52
add comment
<script type="text/javascript" src="/_layouts/15/init.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.runtime.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.js"></script>
<script type="text/ecmascript" src="/_layouts/SP.Core.js" />
<script type="text/ecmascript" src="/_layouts/SP.Debug.js" />

<script type="text/ecmascript">
ExecuteOrDelayUntilScriptLoaded(createList, "sp.js");
    function createList() {
        var clientContext = new SP.ClientContext.get_current();
        var oWebsite = clientContext.get_web();

        var listCreationInfo = new SP.ListCreationInformation();
        listCreationInfo.set_title('CustomList'); // list name
        listCreationInfo.set_description('description'); // list description
        listCreationInfo.set_templateType(SP.ListTemplateType.genericList); //list type

        oWebsite.get_lists().add(listCreationInfo);

        clientContext.executeQueryAsync(
            Function.createDelegate(this, this.onQuerySucceeded),// when success
            Function.createDelegate(this, this.onQueryFailed) // when failed
            );
    }
    function onQuerySucceeded() {
        alert("List Created");
    }

    function onQueryFailed(sender, args) {
        alert("List Failed");
    }

</script>
share|improve this answer
    
Can you please add some text to this answer, telling us what the scrit does? :) –  Robert Lindgren Mar 14 at 8:01
    
Well, yes the answer may be no good but that is not up to me in my role as a moderator to decide. That is up to you by using the downvote or upvote buttons @SPArchaeologist. –  Robert Lindgren Mar 14 at 10:19
    
nope, it seems that it was all in my head. I could swear the question actually said "to retrieve data from a list". Must have been a brain mix - I am currently reading documentation about list use with rest/ecmascript.... Sorry @utkarsh, please disregard my (now deleted) comment above. –  SPArchaeologist Mar 14 at 10:24
add comment

Working code for ecmascript just add the content place holder ..through web part than. click on edit this webpart than make sure that u have selected the content place holder and click on edit source..and it should be empty if you have selected any other web part it will show you some div etc... so make sure that you have selected the content place holder..and just copy the below code there...

and if you want to change the list name..than u can change it here listCreationInfo.set_title('CustomList');

Steps: 1. add a page in sharepoint site. 2. add a web part(content place holder) 3. click on edit this web part 4. now click on edit source make sure..(Add web content is clicked) it will show you the dotted line that your content editor is selected.(you can check it by clicking on select button on a format toolbar(right side) it will show you which box is selected. 5. click on Edit Source. 6.Copy the code. 7. Happy Coding :)

<script type="text/javascript" src="/_layouts/15/init.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.runtime.js"></script>
 <script type="text/javascript" src="/_layouts/15/sp.js"></script>??

 <script type="text/ecmascript">
     ExecuteOrDelayUntilScriptLoaded(createList, "sp.js");
     function createList() {
     var clientContext = new SP.ClientContext.get_current();
     var oWebsite = clientContext.get_web();

    var listCreationInfo = new SP.ListCreationInformation();
    listCreationInfo.set_title('CustomList'); // list name
    listCreationInfo.set_description('description'); // list description
    listCreationInfo.set_templateType(SP.ListTemplateType.genericList); //list type

    oWebsite.get_lists().add(listCreationInfo);

    clientContext.executeQueryAsync(
     Function.createDelegate(this, this.onQuerySucceeded),// when success
     Function.createDelegate(this, this.onQueryFailed) // when failed
     );
}
function onQuerySucceeded() {
    alert("List Created");
}

function onQueryFailed(sender, args) {
    alert("List Failed");
}

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.