0

我已经构建了一个 jQuery 移动应用程序，它通过 JSON 和一个与数据库接口的服务器端脚本 (ColdFusion CFC) 从外部 SQL 服务器数据库获取其内容。此应用程序已使用 PhoneGap 打包为本机应用程序。我需要使 jQuery 移动应用程序能够写回外部 SQL 服务器数据库。

我是移动开发新手，但使用 ColdFusion 进行了几年的服务器端开发。我猜测最好的方法是让移动应用程序将提交的表单元素的结果发送到服务器端脚本进行处理。我不希望本机应用程序将此“作为网页”发送，而是留在应用程序中执行此操作（我假设通过 AJax）。

我的服务器端脚本将用 ColdFusion 编写并处理输入卫生和数据库交互......我只需要弄清楚从我的 jQuery 应用程序提交到服务器端脚本的最佳方式是什么，但要在我的内部进行本机应用程序。

4

1 回答 1

1

我几乎在做同样的事情。服务器端Coldfuison8/MySQL，前端Jquery Mobile(, requireJS) 与所有表单提交通过 AJAX 路由以避免重新加载页面。

我在我的 中使用了一个通用的表单提交器controller.js，它看起来像这样：

var ajaxFormSubmit = 
     function ( form, service, formdata, targetUrl, successHandler, dataHandler, errorHandler ){
     $.ajax({
        async: false,
        type: "post",
        url: service,
        data: formdata,
        dataType: "json",
        success: function( objResponse ){
            if (objResponse.SUCCESS == true ){
                // alert("success!");
                // this passes the response object to the success handler 
                // in case data needs to be ... handled.
                dataHandler == "yes" ? successHandler( objResponse ) : successHandler();
            } else {
                // alert("AJAX failed!");
                if ( errorHandler != "" ){
                    errorHandler();
                    }
                }
            },
        error: function (XMLHttpRequest, textStatus, errorThrown) { 
            //alert("something else failed");
            showErrors( [["server-request-error", "server_error"]], XMLHttpRequest, textStatus, errorThrown );
            }
        });
    }

我将结果作为响应对象返回，其中将包含Success = True/false, data（如果有的话）和Error = error message.

函数调用将如下所示：

// the form 
var form = $(this).closest('form'),
    // trigger for cfcase inside my cfc
    switcher = form.find('input[name="form_submitted"]').val(),
    // which cfc to call
    service = "../cfcs/form_handler_abc.cfc",
    // the method in your cfc you are calling (validation/commit to database)
    method = "process",
    returnformat = "JSON",
    // not using 
    targetUrl = "",
    // serialized form plus any value you need to pass along
    formdata = form.serialize()+"&method="+method+"&returnformat="+returnformat,
    // specific error routine to run
    errorHandler = function(){
        // in my case, reset the whole form
        cleanUp( $('form:jqmData(search="regular")'), "results" )   
        },
    // inside my success handler I'm switching depending on submitted form
    // `response` will be the AJAX object.response = whatever you send back from the server
    successHandler = function( response )  {
        switch (switcher) {

            // form A - this is for a search form handling the results
            case "getProducts":
                // clean up
                $('.ajaxContainer, .pagination').addClass('fade out').remove();
                // AJAX data received
                var makeUp = response.DATA;
                // don't forget to trigger create to enhance all JQM elements you are sending
                $('.results').append( makeUp ).trigger('create');
                // redraw - will fire JQM updatelayout
                $(window).trigger('dimensionchange');
                // will set bindings on new elements
                bindResults( $('.results').closest('div:jqmData(role="page")') );
                break;

            case "A": 
                // do sth else
                break;

            case "B": 
                // do sth else
                break;          
                }
            };
        // now pass all of the above to the ajaxFormsubmit
        ajaxFormSubmit( form, service, formdata, targetUrl, successHandler, handleData, errorHandler);

我有许多 CFC，每个 CFC 都有一个主表单cfswitch和cfcase每个提交的表单。我已经使用这个示例构建了我的后端。花了一段时间才开始，但现在它或多或少地运行得很顺利。

如果您对上述内容有任何疑问，请告诉我。

于 2012-08-17T20:20:37.243 回答