locked
jQuery/JavaScript - Set HTML value in web resource RRS feed

  • Question

  • I am making an OData call which returns the correct data I need (Question, Topic and Score).  I then have identified the first record in the array and I am trying to set an HTML cell value (for the Topic) value using jQuery.  For whatever reason, it is not working.  Eventually, what I would like to do with this code is that for every question returned in the OData (which will include each question's respective Topic and Score), I would like for jQuery to dynamically create a row per Question in the HTML table.  Here is what I have so far for both jQuery and HTML.  FYI--checkAccountType is being called in the OnLoad event handler in CRM:

    //  Get Scoring records of current Account
    
      //Wait for page to load then check Account Type
    //$(document).ready(function () {
    //    console.log("document).ready fired");
    //    checkAccountType();
    //});
    
    //  Check Account Type
    function checkAccountType() {
        //  Validation to check if there is a value in the Organization Type lookup field
        var lookup = Xrm.Page.getAttribute("new_customertypeid").getValue();
        if ((lookup != null) && (lookup != "undefined")) {
            //  Call getScoringQuestions
            getScoringQuestions();
        }
    
    }
    
    //  Grabs the specific details from the parent Account record
    function getScoringQuestions() {
    
        var accountId = Xrm.Page.data.entity.getId();
        var accountFilter = "$select=new_Score,new_ScoringQuestionId,new_new_scoringquestion_new_scoring/new_QuestionTopicId,new_new_scoringquestion_new_scoring/new_SequenceId&" +
                            "$expand=new_new_scoringquestion_new_scoring&$filter=new_ScoringAccountId/Id eq guid'" + accountId + "'";
        SDK.JQuery.retrieveMultipleRecords(
            "new_scoring",
            accountFilter,
            function (results) {
                for (var i = 0; i < results.length; i++) {
                    var topics = results[i].new_new_scoringquestion_new_scoring.new_QuestionTopicId.Name;
                    var questions = results[i].new_ScoringQuestionId.Name;
                    var scores = results[i].new_Score;
    
                    var firstTopic = results[0].new_new_scoringquestion_new_scoring.new_QuestionTopicId.Name;
                    var firstQuestion = results[0].new_ScoringQuestionId.Name;
                    var firstScore = results[0].new_Score;
    
                    //console.log(topics);
                    //console.log(questions);
                    //console.log(scores);
    
                    console.log(firstTopic);
                    //console.log(firstQuestion);
                    //console.log(firstScore);
    
    
                    $("#Topic").html(firstTopic);
                    $("#Question").html(firstQuestion);
                    $("#Score").html(firstScore);
    
    
    
    
    
                }
    
    
            },
            errorHandler,
            questionRetrieveComplete);
    
    
    
    }
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <link rel="stylesheet" type="text/css" href="../styles/SummaryTable.css"/>
        <script type="text/javascript" src="../../ClientGlobalContext.js.aspx"></script>
        <script type="text/javascript" src="../../new_SDKJquery"></script>
        <!--<script type="text/javascript" src="../scripts/jquery.js"></script>-->
        <script type="text/javascript"src="../../new_/scripts/jquery.1.10.2.min.js"></script>
        <script type="text/javascript" src="../scripts/sdk/json2.js"></script>
        <script type="text/javascript" src="../../new_/sdk/rest.js" ></script>
        <script type="text/javascript" src="../scripts/entities/account_scoring.js"></script>
    
    </head>
        
    <body>
    
    	<table id="scoringSummary" width="100%" border="1" cellpadding="0" cellspacing="0">
            <thead id="theads">
        	    <tr>
            	    <th class="th">Topic</th>
                    <th class="th">Question</th>
                    <th class="th">Allowed Values</th>
                    <th class="th">Score</th>
                    <th class="th">Is Editable?</th>
                </tr>
            </thead>
        
            <tbody id="tbody">
        	    <tr>
                    <td id="Topic"></td>
                    <td id="Question"></td>
                    <td id="allowedValues" align="center">    
                        <!-- Dropdown -->
                        <select id="dropdown">
                          <option value="optionValue">Option Value</option>
                        </select>
                    </td>
                    <td id="score"></td>
                    <td id="isEditable">
                        <input type="radio" name="editable" value="0"/>No
                        <input type="radio" name="editable" value="1"/>Yes
                    </td>
                </tr>
            </tbody>
        
        </table>
    
    
    
    </body>
    </html>

    If anyone could provide some insight, it would be greatly appreciated.  Thanks in advance!

    Monday, November 4, 2013 3:05 PM