2 Replies Latest reply on Sep 22, 2011 2:51 PM by WebolutionDesigns

    Invoke CFC with Button

    WebolutionDesigns Level 1

      I have a form I built wherein I am binding several fields to one cfinput and hitting a cfc I built that pulls data from a web service. I am struggling in figuring out how to get the fields to fill in with the binding value once I click a button. Here's the scenario...the end user fills in the field, clicks a button and several other fields get filled in from the cfc that hits the web service. I have tried the following to no avail...

       

      <cfform id="myForm" format="html">

      <cfinput type="text" name="reporttype" id="reporttype" value="BASIC">

      <cfinput type="text" name="vin" id="vin" value="xxxxxxxxxxxxxxxxx"><br />

      <cfinput type="text" name="modelYear" value="" size="30"  bind="cfc:cfc.vinlookup.getYearvin(argVIN={vin},argReporttype={reporttype})" /><br />

      <cfinput type="button" value="getvin" name="getvin" id="getvin">

      </cfform>

       

      I have even tried playing with the cfajaxproxy tag and the @click event. I feel like I am close. If someone could educate me/point me in the right direction, I would appreciate it.

       

      Thanks,

       

      ~Clay

        • 1. Re: Invoke CFC with Button
          WebolutionDesigns Level 1

          When I add the @click in the above bind attribute, it works when I click in the appropriate fields, but I cannot seem to figure out how to run the bind when clicking the button.

          • 2. Re: Invoke CFC with Button
            WebolutionDesigns Level 1

            ok...I figured it out and thought I would post my solution in case someone else runs into this issue...

             

            (my solution is based of of this link)

             

            cfajaxproxy tag to tie cfc to page via JSON

             

            <cfajaxproxy cfc="proxy" jsclassname="proxy" />

             

            Script that runs the method within the cfc and uses the setCallbackHandler function to return the result. The we can set the result equal to the value utilizing the DOM.

             

            <script>

                      function getYearvin(source) {

                                var instance = new proxy();

                                instance.setCallbackHandler(getYearvinSuccess);

                                instance.getYearvin(source);

                      }

             

             

                      function getYearvinSuccess(result) {

                                document.getElementById('year').value = result;

                      }

            </script>

             

            Here is the form...

             

            <input type="text" name="source" id="source" value="" />

            <button name="vinDecode" onClick="getYearvin(getElementById('source').value)">Get Year</button>

            <br><br>

            <input type="text" name="year" id="year" value="" />

             

            FYI...I wrote a quick blog post concerning this...http://webolutiondesigns.com/blog/ajaxcfcs-json-and-other-geeky-stuff/