Question

正在使用phonegap / cordova 3.0.0开发应用程序，我正在尝试使用我在此repo中找到的datepicker插件在我的应用程序中获取本机日期选择器。但是在浏览了phonegap 3.0.0的插件文档后，我发现该插件与phonegap 3.0.0不兼容，所以我尝试使用phonegap文档中的指南修改并将其托管在github here上，这样我就能添加我的项目。但是当我尝试在骨干视图中触发插件时，我在eclispe logcat中看到了这些错误

exec() call to unknown plugin: Datepicker
 datePicker Plugin.js failed: Class not found at file:///android_asset/www/plugins/org.apache.cordova.datepicker/www/datepicker.js:44

我的观点看起来像这样

define(['marionette', 'text!templates/composer.html'], function (marionette, ViewTemplate) {
    'use strict';

    var ComposerView = marionette.ItemView.extend({
        template: _.template(ViewTemplate),

        initialize: function(options) {
            this.formValid = false;

            if(options.id !== null) {

                if(this.options.type == "credit")
                var collection = App.Credits;
                else
                    var collection = App.Debits;

                var model = collection.get(options.id);
                this.model = model;
                this.formValid = true;
            }
            else {
                var modelAttr = {name: false, amount: false, due_date: null, reason: null};
                this.model = new Backbone.Model(modelAttr);
            }
        },

        onRender: function() {
            var height = $(window).outerHeight();
            this.$el.height(height);
        },

        onBeforeClose: function() {
            if(App.Ui.Popupmenu.isShown)
                App.Ui.Popupmenu.hide();

            if(App.Layout.menuVisible)
                App.Layout.hideMenu();
        },

        ui: {
            name: "#name",
            amount: "#amount",
            due_date: "#due_date",
            reason: "#reason"
        },

        events: {
            'click div.button.save': 'save',
            'click div.button.cancel': 'cancel',
            'blur input': 'validateField',
            'focus .nativedatepicker': "showDatepicker"
        },

        showDatepicker: function(event) {
             var currentField = $(event.currentTarget);
             var myNewDate = Date.parse(currentField.val()) || new Date();
             if(typeof myNewDate === "number"){ myNewDate = new Date (myNewDate); }

            // Same handling for iPhone and Android
            console.log(window.plugins.datePicker);
            window.plugins.datePicker.show({
                    date : myNewDate,
                    mode : 'date', // date or time or blank for both
                    allowOldDates : true
                }, function(returnDate) {
                    var newDate = new Date(returnDate);
                    currentField.val(newDate.toString("dd/MMM/yyyy"));
                    // This fixes the problem you mention at the bottom of this script with it not working a second/third time around, because it is in focus.
                    currentField.blur();
             });
        },

        validateField: function (event) {

            var field = $(event.currentTarget);

            if(field.hasClass('required'))
                this.required(field);

            if(field.hasClass('numeric'))
                this.numeric(field);
        },

        required: function (field) {

            if(field.val()) {
                this.formValid = true;
                field.parent('div.form-group').removeClass('error');
            }
            else {
                this.formValid = false;
                field.parent('div.form-group').addClass('error');
            }
        },

        numeric: function (field) {

            var pattern = /[1-9][0-9]*/;
            var value = field.val().toString();

            if(pattern.test(value)) {
                this.formValid = true;
                field.parent('div.form-group').removeClass('error');
            }
            else
            {
                this.formValid = false;
                field.parent('div.form-group').addClass('error');
            }
        },

        save: function (event) {
            var self = this;

            var el = $(event.currentTarget);
            el.removeClass('active').addClass('active');

            window.App.Ui.ActivityIndicator.show('Please wait...')
            //determine which collection to use
            if(this.options.type == "credit")
                var collection = App.Credits;
            else
                var collection = App.Debits;

            if(this.formValid) {

                var model = {
                    name: this.ui.name.val(),
                    amount: this.ui.amount.val(),
                    reason: this.ui.reason.val(),
                    type: this.options.type
                };

                if(this.options.action == "add")
                {
                    collection.create(model, {
                        wait: true,
                        success: function(model, resp, options) {
                            self.saveSuccess(model, resp, options, self);
                        } 
                    });
                }
                else if(this.options.action == "edit")
                {
                    this.model.save(model, {
                        wait: true,
                        success: function(model, resp, options) {
                            self.saveSuccess(model, resp, options, self);
                        }
                    });
                }

            }
        },

        saveSuccess: function(model, resp, options, cxt) {
            window.App.Ui.ActivityIndicator.hide();

            if(cxt.options.type == "credit")
                window.location.hash = "creditors";

            else if(cxt.options.type == "debit")
                window.location.hash = "debtors";
        },

        cancel: function(event) {
            //TODO: add cancel confirmation
            window.history.back();
        }
    });

    return ComposerView;
});

插件有什么问题？任何帮助将不胜感激

Answer 1

我通过对plugin.xml文件和我的应用程序的config.xml进行一些更正来解决问题

的plugin.xml

<name>Datepicker</name>
<description>Cordova Datepicker Plugin</description>
<license>Apache 2.0</license>
<keywords>cordova,datepicker</keywords>
<author>Patrick Foh</author>

<js-module src="www/datepicker.js" name="Datepicker">
    <clobbers target="window.plugins.datePicker" />
</js-module>

<!-- android -->
<platform name="android">
    <config-file target="res/xml/config.xml" parent="/*">
        <feature name="Datepicker">
            <param name="android-package" value="org.apache.cordova.datepicker.Datepicker"/>
        </feature>
    </config-file>

    <source-file src="src/android/Datepicker.java" target-dir="src/org/apache/cordova/datepicker" />
</platform>

config.xml中

<?xml version='1.0' encoding='utf-8'?>
<widget id="com.chronotechlabs.debtr" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>Debtr</name>
    <description>
       Keep track of who you owe and who owes you money
    </description>

    <author email="debtr@chronotechlabs.com" href="http://chronotechlabs.com">
       Chronotech Labs Ltd
    </author>

    <feature name="SplashScreen">
        <param name="android-package" value="org.apache.cordova.SplashScreen" />
    </feature>

    <feature name="Storage">
        <param name="android-package" value="org.apache.cordova.Storage" />
    </feature>

    <feature name="Notification">
        <param name="android-package" value="org.apache.cordova.Notification" />
    </feature>

    <feature name="NetworkStatus">
        <param name="android-package" value="org.apache.cordova.NetworkManager" />
    </feature>

    <feature name="Datepicker">
        <param name="android-package" value="org.apache.cordova.datepicker.Datepicker"/>
    </feature>

    <access origin="*" />
    <preference name="fullscreen" value="false" />
    <preference name="webviewbounce" value="true" />
    <preference name="splashscreen" value="splash" />
</widget>

Datepicker插件无法在phonegap 3.0.0中运行

1 个答案: