Forums

Forums / Bugs & Issues / Unable to derive a selected value from a Common Control field

Unable to derive a selected value from a Common Control field

Thread is closed for posting
14 posts, 1 answered
  1. clefsrud
    clefsrud avatar
    26 posts
    Registered:
    24 Nov 2014
    24 Nov 2014
    Link to this post
    My basic question is: How do I derive a value from a non-CRM widget and post that value via a CRM widget to CRM.

    Specifically, I want to post a text string to a text field on the task entity in CRM from the portal. I want to limit/control the exact strings that may be sent to CRM.  Therefore, I chose to use a FormMultipleChoice field to provide the portal user with the list of acceptable strings.  However, I am not able to read the text (or item or any aspect) of the selected option from the FormMultipleChoice field to send to the portal field bound to the CRM text field.

    I could do this by configuring a new optionset field in CRM.  However I really do not want to create a very specific and narrowly focused custom field on such a universally used entity.

    Chris Lefsrud
  2. Clinton Bale
    Clinton Bale avatar
    126 posts
    Registered:
    21 Feb 2014
    Answered
    25 Nov 2014
    Link to this post

    Great question. The Portal Connector forms functions similarly to Dynamics CRM forms, meaning you have to put all custom form logic in JavaScript. To do this in the Portal Connector requires both page and form widgets. To do what you requested you must first put all the required controls on the form:

    • Rules Manager (JavaScript API)
    • Multiple choice field (source field)
    • CRM Text Field (target field)

    The Rules Manager here requires no configuration, it just provides the JavaScript API that we need. Open the editor of the Multiple Choice field and go to the Appearance tab in the designer, the CSS class here will be the unique identifier of the control that the Rules Manager looks for, give it a name with no spaces (like MultiChoice1). Configure the CRM Text Field to populate the desired field in CRM and note down the name for developers (similar to CrmTextField_C005).

    In order for this to work with The Portal Connector 2.3, you must add a JavaScript control to the page that the form will be residing on (with the CRM Form Manager widget). The JavaScript widget is in the toolbox under Scripts and Styles. Open the designer for the JavaScript widget and select the “Write JavaScript” tab; configure the control to include the JavaScript “Where the widget is dropped” and add the following code to the textbox:

    $(window).load(function() {
    findControl("MultiChoice1").add_valueChanged(function(sender,args){
    findControl("CrmTextField_C005").set_value(sender.get_selectedName()); });
    });

    This code provides the basic functionality you need. It attaches an event handler when the window loads to the value changed event of the multiple choice field and sets the value of the CRM Text Field whenever it changes.

    If you wish to hide the target field, you must apply a CSS class to it. To do this add a CSS widget to the page, open the designer and select the “Write CSS” tab and add the following style:

    .CrmTextField_C005 { 
    display: none;
    }

    I hope this solves the issue.

    Last modified on 25 Nov 2014 14:11 by Clinton Bale
  3. clefsrud
    clefsrud avatar
    26 posts
    Registered:
    24 Nov 2014
    26 Nov 2014 in reply to Clinton Bale
    Link to this post
    Indeed it does. Excellent.

    Now that I know the mechanics of this type of control, I will need to apply similar concepts elsewhere also.  However, this JS is not at all like the JS used in CRM.  Where might I find some basic snippets and reference information in order to understand how to build my own logic?  Examples include hiding or disabling my Multiple Choice field based on the contents of a CRM bound field, and conditionally disabling a field based on the states of two bit fields.
    Last modified on 26 Nov 2014 21:11 by clefsrud
  4. Clinton Bale
    Clinton Bale avatar
    126 posts
    Registered:
    21 Feb 2014
    28 Nov 2014 in reply to clefsrud
    Link to this post

    Hello Chris,

    I apologize for the late response, but I’m sure I can help you out with this question.

    Most of the Portal Connector’s widgets use Telerik controls for their interface, and with these controls comes a whole lot of functionality and JavaScript API. Our widgets also expose API so that the Rules Manager can interact with them, however this API is currently undocumented.

    There is some common functionality that is available for all controls that could interact with the rules manager. These are:

    • get_value()

      returns the value of the widget

    • set_value(value) 

      takes in a new value and sets the value of the widget

    • disable() 

      disables the widget

    • enable() 

      enables the widget

    Each widget also has a function to return the Telerik control, so you can interact with in a more advanced way. Here are a few of them:

    Since our widgets are identified by CSS classes, it makes it easy to hide or show a widget on the form, simply call the appropriate JQuery function using the CSS class as the selector:

    $(“CrmTextField_C005”).hide();

    The multiple choice field is a Telerik widget and not a Portal Connector widget, but here are some functions that may be able to help you out:

    • set_visible(value)
      takes a Boolean and either shows or hides the control
    • disable()
      disables the widget
    • enable() 
      enables the widget
    • get_choices() 
      returns an array of the choices in the multiple choice fields

    I hope you find this useful.

    Last modified on 28 Nov 2014 15:11 by Clinton Bale
  5. clefsrud
    clefsrud avatar
    26 posts
    Registered:
    24 Nov 2014
    02 Dec 2014 in reply to Clinton Bale
    Link to this post
    Okay, still having challenges with the coding.  Thanks for pointing out the Rad control reference material and related. Lists of methods and properties are good, but I’m still unable to figure out the syntax and form that I need to make things work.  The example you provided works great dealing with a MultipleChoice field, but I cannot seem to modify so that it works for my specific application, or perhaps the mechanics differ (i.e. can/do I specifically call a function).   Same for the only other examples I could find in the RadComboBox control; not able to make anything work.  Also, my experience with AJAX is limited. 

    As an example, I have three CRM-linked text fields; two are provided to the user for input; the third is a concatenation including input from the first two (i.e. as in defining a specific string for a name field), and is will be hidden from the user.  If either of the first two fields are modified, the change needs to reflected also in the third field.  I have tried a
    number of different approaches.  But without actually seeing code that works, it’s just trial and error.

    Any help would be greatly appreciated.
  6. Clinton Bale
    Clinton Bale avatar
    126 posts
    Registered:
    21 Feb 2014
    03 Dec 2014 in reply to clefsrud
    Link to this post
    The solution for this behaves similarly to your first question in the thread. We must create event listeners for the changed event on two textboxes to concatenate them to a third. To do this remember you will need to add a blank RulesManager for the JavaScript API to be enabled. Change the ID's in the example below to work with your controls:

    $(window).load(function() {
      function concatAB(sender, args) {
        var a = findControl("CrmTextField_C001").get_value();
        var b = findControl("CrmTextField_C002").get_value();
        findControl("CrmTextField_C003").set_value(a + " " + b);
      }
      findControl("CrmTextField_C001").get_txtText().add_valueChanged(concatAB);
      findControl("CrmTextField_C002").get_txtText().add_valueChanged(concatAB);
    });

    Let me know if this example works for you and if this has clarified things up a bit about interacting with the API.

    P.S. Version 2.4 of The Portal Connector will include the JavaScript widget on Forms. You will be able to include all of the JavaScript functionality alongside the form instead of having to put the widget on the page that the form is on.

    Last modified on 03 Dec 2014 14:12 by Clinton Bale
  7. clefsrud
    clefsrud avatar
    26 posts
    Registered:
    24 Nov 2014
    04 Dec 2014 in reply to Clinton Bale
    Link to this post
    Yes, that's more what I was after, thank you.  I can see what's happening.

    The downside however, is that it's not working for me, and it's difficult to figure out where the problem is.  Perhaps take a look at this video. Any ideas?

    Also, I cannot find the reference documentation for methods like 'get_selectedName()' or 'add_valueChanged'; where would I find this material.

    And, is JS always implemented this way?  I had originally made the assumption that I would use the 'Run Script' option in the Rules Manager; is there any time when this approach would be used?

    Chris Lefsrud




    Last modified on 04 Dec 2014 20:12 by clefsrud
  8. Clinton Bale
    Clinton Bale avatar
    126 posts
    Registered:
    21 Feb 2014
    05 Dec 2014 in reply to clefsrud
    Link to this post
    Hello Chris,

    I took a look at your demo site and immediately found the issue. Your demo site was running a slightly older version of the Portal Connector where some Rules Manager changes were not present - the function call to get the textbox was names get_textbox not get_txtText. The controls you were interacting with also were not created with rules manager functionality. I recreated the First Name, Last Name and the Address Name fields and updated the Java Script to match the new names, it now works correctly.

    The documentation for the Multiple Choice field seems to be limited. I could not find any documentation that specifically outlines the JavaScript API for that control. I found that function name and what it does by going through the list of functions in the JavaScript object and finding one that looks like what I needed.

    You can find the documentation for add_valueChanged and other events for the RadTextBox here.

    In the version you have, JavaScript has to be executed this way. In the Portal Connector v2.4, there is a Rules Manager event for 'Window Loaded' that you can use the 'Execute Script' functionality to do exactly what we're doing here. The 'Execute Script' functionality in your version could be used to execute scripts when a field contains a certain piece of text.

    We will be updating all active demo sites with the The Portal Connector v2.4 when it goes live in mid-December.

    Regards,
    Clinton
  9. clefsrud
    clefsrud avatar
    26 posts
    Registered:
    24 Nov 2014
    12 Jan 2015 in reply to Clinton Bale
    Link to this post
    Basically the same kind of issue as before, in that I cannot figure out the correct terminology.  I am now working in our production instance which is the newer version of the Portal Connector (I can use “get_txtText()” as opposed to “get_textbox”).

    In a nutshell, I want to capture the text component from the selected value in a dropdown field (…_C062), which ultimately is to be assigned to a text field.  What I have is in the form:

    $(window).load(function() {
       function copyPrefix(sender, args) {
          alert(“test”);
          var prefix = findControl("CrmPicklist_C062").get_text();
          findControl("CrmTextField_C061").set_value(prefix);
       }
       findControl("CrmPicklist_C062").get_cboPicklist().add_valueChanged(copyPrefix);
    });

    I have tried a number of options for the “get_text()” and “get_cboPicklist()” strings, but no luck; actually can’t get the function to be called (i.e. no alert).  As before, I cannot find any documentation to provide me with information that would help me.

    I haven’t yet needed to derive the text or value (guid) from a lookup control, but I am sure that it will come up.  While we’re at it, how would I do this?

    Chris Lefsrud
  10. Clinton Bale
    Clinton Bale avatar
    126 posts
    Registered:
    21 Feb 2014
    12 Jan 2015 in reply to clefsrud
    Link to this post

    Hi Chris,

    The JavaScript API for all of our widgets is currently undocumented, however we do plan on documenting the API in the future once it gets completely finalized.

    Here is the list of functions for some controls you may be working with:

    CrmPicklist / CrmLookup:

    • get_value()
    • set_value(value)
    • get_selectedText()
    • set_selectedText(value)
    • clearSelection
    • get_cboPicklist() / get_cboLookup() - returns the Telerik RadComboBox

    CrmDateTime:

    • get_value()
    • set_value(value)
    • get_dateText()
    • set_dateText(dateString)
    • get_dateTimePicker() - returns the Telerik RadDateTimePicker

    CrmBoolean:

    • get_value()
    • set_value(booleanValue)
    • get_boolText()
    • set_boolText(booleanValueString)
    • get_type() - returns the type of boolean control (CheckBox,DropDown,RadioButton)
    • get_trueControl()
    • get_falseControl()

    These functions should be self explanatory by name, if not I added a comment. If you need any more clarification on any of these functions or a list of functions from other widgets, let me know.

    Regards,
    Clinton

    Last modified on 12 Jan 2015 17:01 by Clinton Bale
  11. clefsrud
    clefsrud avatar
    26 posts
    Registered:
    24 Nov 2014
    09 Jun 2015 in reply to Clinton Bale
    Link to this post
    I now need to add a bit of logic based on the presence/absence of a date value, to an existing set of working code...

    This is the beginning of the original function, and it works fine:

      function controlProtected(sender, args) {
        var wasProt = findControl("CrmBoolean_C053").get_value();
        var isProt = findControl("CrmBoolean_C047").get_value();
        alert("Point A");

    With adding one more variable as I have here, everything fails:

      function controlProtected(sender, args) {
        var wasProt = findControl("CrmBoolean_C053").get_value();
        var isProt = findControl("CrmBoolean_C047").get_value();
        var theDate = findControl("CrmDateTimeField_C076").get_value();
        alert("Point A");

    Likewise, this also fails: "var theDate = findControl("CrmDateTimeField_C076").get_dateText();"

    How do I get a value from a date field?

    Part 2:
    Lower down in the same function, I am not able to exert any control over a form’s submit button (i.e. “findControl("claim_button", where “claim_button” has been assigned as the button’s CSS class), like enable/disable or setting visibility.  Likewise, I am not able to accomplish this on the form with a rule.  Suggestions?

    Chris Lefsrud
  12. Clinton Bale
    Clinton Bale avatar
    126 posts
    Registered:
    21 Feb 2014
    10 Jun 2015 in reply to clefsrud
    Link to this post
    Hello Chris,

    A previous functionality change has caused the get_value function in the API for the CRM Date Time Picker to stop working correctly. In the meantime please use:

    findControl("abc").get_dateTimePicker().get_selectedDate();
    

    as opposed to:

    findControl("abc").get_value();
    

    This will return the correct result. This issue has been fixed and will be included in the next service pack for TPC 3.0.

    Our "findControl" API and the Rules Manager exclusively work for TPC ​form widgets and controls, accessing any Sitefinity buttons or other widgets is not supported by our API. To find the "claim_button" try using jQuery:

    var button = $(".claim_button");
    

    Best Regards,
    Clinton

    Last modified on 10 Jun 2015 14:06 by Clinton Bale
  13. clefsrud
    clefsrud avatar
    26 posts
    Registered:
    24 Nov 2014
    10 Jun 2015 in reply to Clinton Bale
    Link to this post
    Still not working for me.

    This version of the function works, using the presence/absence of a value in a text field to control availability of a bit field.

      function controlProtected(sender, args) {
        var myDate = findControl("CrmTextField_C032").get_value();  // text field value
        var button = $(".claim_button");
    alert("Point A: " + myDate);

        if (myDate == " ") {   
    alert("Textfield is null; can be claimed");
            findControl("CrmBoolean_C047").set_visible(true);  // a bit field as opposed to a button
        }
        else {
    alert("Textfield is populated; can’t be claimed");
            findControl("CrmBoolean_C047").set_visible(false);
        }
      }


    The following function version does not work; the presence/absence of a value in a date field to control the availability of a button control.  To be clear, neither the capture of the date field value nor the control of the button work (tested by switching out the pieces from the code above that does work).  So, I cannot control the button with the state of the text field used above, nor control the bit field (above) with the date field (below).  Tried a few other variations as well.

      function controlProtected(sender, args) {
    //    var myDate = findControl("CrmDateTimeField_C076").get_dateTimePicker().isEmpty();
        var myDate = findControl("CrmDateTimeField_C076").get_dateTimePicker().get_selectedDate();
    // neither option works (neither of these myDate assignments), or other options like .get_dateText;
        var button = $(".claim_button");
    alert("Point A: ");

        if (myDate == " ") {   
    alert("Date is null; can be claimed");
            button.set_visible(true);    //also tried set_enabled(true);
        }
        else {
    alert("Date is populated; cannot be claimed");
            button.set_visible(false);
        }
      }
  14. Clinton Bale
    Clinton Bale avatar
    126 posts
    Registered:
    21 Feb 2014
    10 Jun 2015 in reply to clefsrud
    Link to this post
    Hi Chris,

    Since jQuery returns a jQuery object when using their API, you can call the hide function on the button. The set_visible function is a ​function that most Telerik and TPC controls implement, and not a function for the standard input element. Try:

    button.hide();
    

    You were on the right track with the isEmpty function. You don't want to be comparing a date value with a space. Try the following code to complete your logic:

    function controlProtected(sender, args) {
        var myDate = findControl("CrmDateTimeField_C076").get_dateTimePicker();
        var button = $(".claim_button");
        alert("Point A: ");
    
        if (myDate.isEmpty()) {
            alert("Date is null; can be claimed");
            button.show();
        }
        else {
            alert("Date is populated; cannot be claimed");
            button.hide();
        }
    }
    
    Last modified on 10 Jun 2015 19:06 by Clinton Bale
14 posts, 1 answered