Skip to main content
Inspiring
September 12, 2014
Question

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

  • September 12, 2014
  • 1 reply
  • 1768 views

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

    This topic has been closed for replies.

    1 reply

    Carl Von Stetten
    Brainiac
    September 12, 2014

    There is an HTTP limitation on the size of a valid URL string (not a ColdFusion issue, it's at the web server level), and it sounds like you've hit it.  I see you are using the POST type on the AJAX request.  Rather than appending all of your data to the URL, use the "data" setting on the AJAX function (see http://api.jquery.com/jQuery.ajax/#jQuery-ajax-settings).

    Change the URL of the AJAX call to "../components/billing/custompremstatus.cfc?method=GetBillsArr"

    Then add a "data" key between URL and dataType.  Pass the data key a JavaScript object containing key/value pairs of the data you are sending, like this:

    url: "../components/billing/custompremstatus.cfc?method=GetBillsArr",

    data: {

         planenrolldate_id: plID,

         sponsorid: sID,

         fM: fromMonth,

         fY: fromYear,

         tm: toMonth,

         ty: toYear

    },

    dataType: "json",

    On the CFC side, the data should be arriving as matching arguments to the function.

    -Carl V.

    Inspiring
    September 12, 2014

    Thank you, Carl


    I changed to POST style:

    url:"../components/billing/custompremstatus.cfc?method=GetBillsArr",
    data:
    {
    sponsor_id: sID,
    planenrolldate_id: plID,
    fM: fromMonth,
    fY: fromYear,
    tM: toMonth,
    tY: toYear
    }...

    As a result I am getting error "The PLANENROLLDATE_ID parameter to the GetBillsArr function is required but was not passed in. 
    The error occurred on line -1. "

    In the console planenrolldate_id looks like array. I selected 2 planenrolldate_id`s in this particular example.

    This is from console:

    fM  9
    fY  2014
    method  GetBillsArr
    planenrolldate_id[] 564
    planenrolldate_id[] 561
    sponsor_id  59
    tM  9
    tY  2014

    Tried changing cfc function to accept planenrolldate_id to "array" and then changed to "any"

    Carl Von Stetten
    Brainiac
    September 12, 2014

    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>


    No, that's what's being "packaged up" into the JSON payload being sent by your AJAX request.  I'm asking you to do this:

    console.log( pIID );

    Maybe put that in your code right after populating the pIID variable from the form inputs (above the AJAX call).  I want to see what JavaScript is doing with the input data.

    -Carl V.