隐藏提交按钮直到成功上传

时间：2014-01-18 06:01:38

标签： android iphone appcelerator

您好我是Appcelerator的新手，我需要帮助我正在开发的应用程序。该应用程序包含一个带有视图的表单，可以从相机拍摄图像或从图库中选择图像。此视图有两个按钮。第一个按钮是上传图像，第二个按钮是提交表单。我想看看是否有人可以帮助修改代码，这样我就可以隐藏提交按钮，直到图像成功上传。在此先感谢您的帮助。这是我正在使用的代码：

var win = Ti.UI.createView({
    width : Ti.UI.FILL,
    height : Ti.UI.SIZE,
    top : 20,
    title : L('header_title'),
});

var topbar = Ti.UI.createView({
    width : Ti.UI.FILL,
    height : 50,
    top : 0,
    title : L('header_title'),
    backgroundImage : Ti.Filesystem.resourcesDirectory + "image/topbar.png",
});

var back_btn = Ti.UI.createButton({
    width : 80,
    height : 30,
    title : "Customer",
    backgroundImage : Ti.Filesystem.resourcesDirectory + "image/button_image.png",
    left : 5,
    top : 10,
    font : {
        fontSize : 12
    },
});

var home_btn = Ti.UI.createButton({
    width : 60,
    height : 30,
    title : "Home",
    backgroundImage : Ti.Filesystem.resourcesDirectory + "image/button.png",
    right : 5,
    top : 10,
    font : {
        fontSize : 12
    },

});
back_btn.addEventListener('click', function() {
    self.close();

});

home_btn.addEventListener('click', function(e) {
    var Window;
    Window = require('ui/handheld/ApplicationWindow');
    new Window().open();
});

var header_title = Ti.UI.createLabel({
    color : 'white',
    font : {
        fontSize : 22
    },
    text : 'Forms',
    textAlign : Ti.UI.TEXT_ALIGNMENT_CENTER,
    top : 10,
    width : Ti.UI.SIZE,
    height : Ti.UI.SIZE
});

topbar.add(header_title);
topbar.add(back_btn);
topbar.add(home_btn);
win.add(topbar);

var scroll = Ti.UI.createScrollView({
    width : Ti.UI.FILL,
    height : Ti.UI.FILL,
    top : "10%",
    contentHeight : 420,
    right : '2%',
    left : '3%',
});

var submit_img1 = Ti.UI.createImageView({
    width : 100,
    height : 100,
    top : 10,
    left : 10,
    backgroundDisabledColor : true,
});

var submit_btn1 = Ti.UI.createButton({
    width : 100,
    height : 30,
    top : 120,
    left : 10,
    font : {
        fontSize : 14
    },      
    backgroundImage : Ti.Filesystem.resourcesDirectory + "image/button.png",
    title : 'Image1',
});


var basicSwitch = Ti.UI.createSwitch({
    top : 330,
    value : true,
    left : -100,
    width : 100
});

basicSwitch.addEventListener('change', function(e) {
    Ti.API.info('Switch value: ' + basicSwitch.value);

});

var upload_btn = Ti.UI.createButton({
    width : 100,
    height : 30,
    top : 330,
    right : 100,
    font : {
        fontSize : 14
    },      
    backgroundImage : Ti.Filesystem.resourcesDirectory + "image/button.png",
    title : 'Upload First',
});

var SubmitForm_btn = Ti.UI.createButton({
    width : Ti.UI.FILL,
    height : 30,
    top : 380,
    right : 10,
    left : 10,
    font : {
        fontSize : 14
    },
    backgroundImage : Ti.Filesystem.resourcesDirectory + "image/button.png",
    title : 'Submit Form',
    enable : 'false',
});

var style;
if (Ti.Platform.name === 'iPhone OS'){
  style = Ti.UI.iPhone.ActivityIndicatorStyle.DARK;
}
else {
  style = Ti.UI.ActivityIndicatorStyle.DARK;
}
activityIndicator = Ti.UI.createActivityIndicator({
  color: 'black',
  font: {fontFamily:'Helvetica Neue', fontSize:26, fontWeight:'bold'},
  message: 'Loading...',
  style:style,
  top:'35%',
  left:"25%",
  height:Ti.UI.SIZE,
  width:Ti.UI.SIZE
});

//image Uploding --Image 1
submit_btn1.addEventListener('click', function(e) {

    ///For Option dialog
    var sourceSelect1 = Titanium.UI.createOptionDialog({
        options : [L('Take Picture'), L('Choose Existing'), L('Cancel')],
        cancel : 2
    });
    sourceSelect1.show();
    sourceSelect1.addEventListener('click', function(e) {
        Ti.App.pic = Ti.App.Properties.getInt('pic');
        if (e.index === 0) {//Camera
            Titanium.Media.showCamera({
                success : function(e) {
                    var image = e.media.imageAsResized(e.media.width / 2, e.media.height / 2);
                    if (e.mediaType == Ti.Media.MEDIA_TYPE_PHOTO) {
                        Ti.App.Properties.setInt('pic', Ti.App.pic + 1);
                        Ti.App.pic = Ti.App.Properties.getInt('pic');
                        var picFileName = 'pic' + Ti.App.pic + '.png';
                        submit_img1.image = image;
                        image_value[0] = e.image;
                        image1_flag = true;
                        totalCount++;
                    }
                },
                error : function(error) {
                    if (error.code == Titanium.Media.NO_CAMERA) {
                        alert(L('no_camera'));
                    }
                },
                saveToPhotoGallery : true,
                allowEditing : true,
                mediaTypes : [Ti.Media.MEDIA_TYPE_PHOTO]
            });
        } else if (e.index === 1) {//PhotoCallery
            Ti.Media.openPhotoGallery({
                success : function(e) {
                    var image = e.media.imageAsResized(e.media.width / 2, e.media.height / 2);
                    if (e.mediaType == Ti.Media.MEDIA_TYPE_PHOTO) {
                        Ti.App.Properties.setInt('pic', Ti.App.pic + 1);
                        Ti.App.pic = Ti.App.Properties.getInt('pic');
                        var picFileName = 'pic' + Ti.App.pic + '.png';
                        submit_img1.image = image;
                        image_value[0] = e.image;
                        image1_flag = true
                        totalCount++;
                    }
                },
                error : function(error) {
                    alert(error.code)
                },
                allowEditing : false,
                mediaTypes : [Ti.Media.MEDIA_TYPE_PHOTO]
            });
        }
    });
});

var ind = Titanium.UI.createProgressBar({
    width : 200,
    height : 50,
    min : 0,
    max : 1,
    value : 0,
    style : Titanium.UI.iPhone.ProgressBarStyle.PLAIN,
    top : 200,
    message : 'Uploading Image',
    font : {
        fontSize : 12,
        fontWeight : 'bold'
    },
    color : '#888'
});

upload_btn.addEventListener('click', function(e) {

    pb.show();

    for(var i=0; i<=7; i++ ) {

        count_image =i+1;
        UploadPhotoToServer(count_image);

    }
});

var createReq = Titanium.Network.createHTTPClient();
SubmitForm_btn.addEventListener('click', function(e) {

activityIndicator.show();
Ti.API.info('Form Submitting');

var sender = Ti.App.Properties.getString('Sender');
var phone = Ti.App.Properties.getString('Phone');
var nts = Ti.App.Properties.getString('Notes');     
var email = Ti.App.Properties.getString('Email');

var st;
Ti.API.info('Switech state:' +basicSwitch.value);

if(basicSwitch.value==true)
{
    st='1';
}
else
{
    st='0';
}


if (Ti.Network.online == false) {
    var alertDL = Ti.UI.createAlertDialog({
        title : L('connection_error_title'),
        message : L('connection_error_msg'),
        buttonNames : ['OK']
    });
    alertDL.show();
} else {

var sender = Ti.App.Properties.getString('Sender');
var phone = Ti.App.Properties.getString('Phone');
var nts = Ti.App.Properties.getString('Notes');     
var email = Ti.App.Properties.getString('Email');

var params = {
//Server : Titanium
sender : sender,
phone : phone,
notes: nts,             
email : email,
enlist:st,
images:finalName,
Action:"coming_from_iphone"
};

//First View

console.log(params);
createReq.open("POST", 'http://www.mysite.com/ajax1.php');
createReq.setRequestHeader('Content-type', 'application/json; charset=utf-8');
createReq.send(params);

createReq.onload = function() {

    Ti.API.info('res@loginReq.onload:\n' + this.responseText);
    //alert(this.responseText);

    var Window;

    Window = require('ui/handheld/ApplicationWindow');

    new Window().open();

}

    createReq.onerror = function(e) {
        //Ti.App.fireEvent('server_error_msg');
        var alertDL = Ti.UI.createAlertDialog({
            title : L('error'),
            message : L('server_error_msg'),
            buttonNames : ['OK']
        });
        alertDL.show();
    }
}

});

var pb=Titanium.UI.createProgressBar({
    top:'50%',
    width:250,
    height:'auto',
    min:0,
    max:80,
    value:0,
    color:'#fff',
    message:'Image Uploading....',

    font:{fontSize:14, fontWeight:'bold'},
    style:Titanium.UI.iPhone.ProgressBarStyle.PLAIN,
});
function UploadPhotoToServer(args) {

Ti.API.info('Image Nimber:',args);
if (Titanium.Network.online == true) {

    var xhr = Titanium.Network.createHTTPClient();
    xhr.setRequestHeader("Content-Type", "application/json; charset=utf-8");
// On lo
    xhr.onerror = function(e) {
        Ti.API.info('IN ERROR ' + e.error);
        alert('Sorry, we could not upload your photo! Please try again.');
    };

    xhr.onload = function() {
    //alert(this.responseText);

    Ti.API.info('Final Name'+this.responseText);
    if(name_count ==0)
    {
        var res=this.responseText;
        finalName+=res;
        name_count++;
        Ti.API.info('Final Name'+finalName);
    }
    else
    {
        var res=this.responseText;
        finalName+=","+res;
        name_count++;

        //finalName =String(finalName ,+ this.responseText());
        name_count++;

        Ti.API.info('Final Name'+finalName);
    }
    // alert(finalName);        

    if (count_upload <= 70) {
            var s=80;


            count_upload += s/totalCount;
            pb.value= count_upload;

            if (count_upload == 80) {

                pb.hide();
            }
        } else {
            pb.hide();
        };
        Ti.API.info('Response From Server:'+this.responseText);
        Ti.API.info('IN ONLOAD ' + this.responseText + " " + this.status + ' readyState ' + this.readyState);

    };

    xhr.onsendstream = function(e) {
        Ti.API.info('ONSENDSTREAM - PROGRESS: ' + e.progress);
        if (Ti.Platform.osname == 'android') {
            //android doesn't support the "progress" variable during onsendstream yet :(
            //we're going to dummy up a progress value for this based on each packet being about 2.5% of the total upload progress
            //it won't be totally accurate, but it will give the user a good indicator that the upload is working
            if (androidUploadProgress < 1) {
                androidUploadProgress += 0.025;
            }
        } else {
            //else on ios devices, calculate the progress of the upload using e.progress
            if (Math.round(e.progress * 100) <= 100)
             {

            //pb.value+=1.0;

            }
            else
            {
                //pb.hide();
            }
        }
    };
    xhr.open('POST', 'http://www.mysite.com/ajax1.php?Action=upload_image');


        if (args==1)
             {
                if (image1_flag == true)
                {
                    xhr.send({
                        userfile : submit_img1.image,
                });
                }
                else
                {
                    //alert('no image');
                }
             };
    } 

    else {
        alert('You must have a valid Internet connection in order to upload this photo.');
    }
}

function createRandomString (argument) 
{
    var text = "";
    var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

    for( var i=0; i < 20; i++ ) {
        text += possible.charAt(Math.floor(Math.random() * possible.length));
    }
    return text;
}
scroll.add(submit_btn1);
scroll.add(submit_img1);
scroll.add(basicSwitch);
scroll.add(upload_btn);
scroll.add(SubmitForm_btn);

win.add(scroll);

self.add(win);
win.add(activityIndicator);
win.add(pb);

win.add(ind);

return self;

2 个答案:

答案 0 :(得分：1)

 Titanium.App.addEventListener('hideButton', function(e) {
            yourButton.hide();
        });

像

一样打电话 
Titanium.App.fireEvent('hideButton');

答案 1 :(得分：-1)

上传广告时

Button button.setEnable(false);

完成后

button.setEnable(true);
相关问题
最新问题