2011-05-01 74 views
0

我在Liferay中編寫了待辦事項列表portlet,我使用一些填充了javascript,html和css的jsp頁面完成了可視化部分,現在我必須編寫業務邏輯。首先我要做的是將一些對象從jquery傳遞給java類,這樣我就可以爲liferay編寫一個連接器,然後創建持久性模型。有人能幫忙嗎?下面是代碼:我如何將jsp數據從jquery傳遞到java類

Query.noConflict(); 

function Todo (pMainFoldersDivId) { 
    this.mainFoldersDivId = pMainFoldersDivId; 
    this.folders = new Array(); 
    this.addFolderPopup; 
    this.editFolderPopup; 
    this.manageFoldersPopup; 
    this.quickNotesPopup; 

    this.addQuickNote = function() { 
    this.quickNotesPopup = new QuickNotesPopup(); 
    this.quickNotesPopup.show(); 
} 

this.saveQuickNote1 = function() { 
    var qnote1 = jQuery('#quicknote1 textarea').val(); 
} 
this.saveQuickNote2 = function() { 
    var qnote2 = jQuery('#quicknote2 textarea').val(); 
} 
this.saveQuickNote3 = function() { 
    var qnote3 = jQuery('#quicknote3 textarea').val(); 
} 

this.addNote = function() { 
    alert('addNote'); 
} 

this.addFolder = function() { 
    if(typeof this.manageFoldersPopup != 'undefined') { 
     this.manageFoldersPopup.hide(); 
    } 

    this.addFolderPopup = new AddFolderPopup(); 
    this.addFolderPopup.show(); 
} 

this.createFolder = function() { 
    var folderTitle = jQuery('#input-folder-title').val(); 
    var folderIcon = jQuery('#select-folder-icon').val(); 
    var folderBgImage = jQuery('#select-folder-bgimage').val(); 

    var folder = new TwFolder('10', folderIcon, folderTitle, folderBgImage); 
    this.folders.push(folder); 

    this.addFolderPopup.hide(); 
    this.renderFolders(); 
} 

this.updateFolder = function() { 
    var folderId = jQuery('#input-folder-id').val(); 
    var folderTitle = jQuery('#input-folder-title').val(); 
    var folderIcon = jQuery('#select-folder-icon').val(); 
    var folderBgImage = jQuery('#select-folder-bgimage').val(); 

    var arrFolder = jQuery.grep(this.folders, function(folder,idx) { 
     return folder.id == folderId; 
    }); 
    if(arrFolder.length > 0) { 
     var folder = arrFolder[0]; 
     folder.title = folderTitle; 
     folder.icon = folderIcon; 
     folder.bgImage = folderBgImage; 

     this.renderFolders(); 
     this.editFolderPopup.hide(); 
     this.manageFolders(); 
    } 
} 

this.editFolder = function(pFolderId) { 
    var arrFolder = jQuery.grep(this.folders, function(folder,idx) { 
     return folder.id == pFolderId; 
    }); 
    if(arrFolder.length > 0) { 
     this.manageFoldersPopup.hide(); 

     var folder = arrFolder[0]; 
     this.editFolderPopup = new EditFolderPopup(folder); 
     this.editFolderPopup.show(); 
    } 
} 

this.deleteFolder = function(pFolderId) { 
    var safe = confirm('Are you sure ?'); 
    if(safe) { 
     for(var i=0; i<this.folders.length; i++) { 
      if(pFolderId == this.folders[i].id) { 
       this.folders.splice(i,1); 
       break; 
      } 
     } 

     this.renderFolders(); 
     this.manageFoldersPopup.hide(); 
     this.manageFolders(); 
    } 
} 

this.manageFolders = function() { 
    this.manageFoldersPopup = new ManageFoldersPopup(this); 
    this.manageFoldersPopup.show(); 
} 

this.renderFolders = function() { 
    var mainFoldersDiv = jQuery('#'+this.mainFoldersDivId); 
    mainFoldersDiv.empty(); 

    var fLength = this.folders.length; 
    jQuery(this.folders).each(function(index, folder) { 
     var folderDivClass = 'inner-folder'; 
     if(index == 0) folderDivClass = 'first-folder'; 
     else if(index == fLength-1) folderDivClass = 'bottom-folder'; 
     var folderDiv = '<div id="'+'tfolder-'+folder.id+'" class="'+folderDivClass+'">'; 
     folderDiv += folder.getHtmlDiv(); 
     folderDiv += '</div>'; 

     mainFoldersDiv.append(folderDiv); 
     var titleLink = jQuery('#tfolder-'+folder.id+' .folder-title a'); 
     titleLink.click(function() { 
      folder.onClick(); 
     });  
    }); 
} 

// Constructor 
this.folders.push(new Folder('1','clock.png', 'Travel Diary', 'folder_blue.png')); 
this.folders.push(new Folder('2','tag_blue.png', 'Secret Diary', 'folder_brown.png')); 
this.folders.push(new Folder('3','post_note.png', 'My Ideas', 'folder_yellow.png')); 
this.folders.push(new Folder('4','lock.png', 'Shopping Dubai Mall', 'folder_mov.png')); 
this.folders.push(new Folder('5','report.png', 'To-Do List', 'folder_orange.png')); 

this.renderFolders(); 
} 

    function Folder(pId, pIcon, pTitle, pBgImage) { 
    this.id = pId; 
    this.icon = pIcon; 
    this.title = pTitle; 
    this.bgImage = pBgImage; 
    this.items = new Array(); 

    this.getHtmlDiv = function() { 
    var result = '<div style="background-image: url(\'<%= request.getContextPath() %>/images/'+this.bgImage+'\');" class="folder-image">'; 
    result += '<span class="folder-icon"><img src="<%= request.getContextPath() %>/images/icons/'+this.icon+'" width="40" height="40" /></span>'; 
    result += '<span class="folder-title"><a href="#">'+this.title+'</a></span>'; 
    result += '<span class="folder-item-number">'+this.items.length+'</span>'; 
    result += '</div>'; 
    return result; 
} 

this.onClick = function() { 
    var popup = new OpenFolderPopup(this); 
    popup.show(); 
} 
} 

function Note(pId, pTitle, pContent, pDueDate, pFolder) { 
    this.id = pId; 
    this.title = pTitle; 
    this.content = pContent; 
    this.dueDate = pDueDate; 
    this.folder = pFolder; 
} 

function OpenFolderPopup(pFolder) { 
     this.folder = pFolder; 
     this.jqmdialog = jQuery('#tw-show-folder'); 

     jQuery('#tw-show-folder .open-folder-header').css('background-image','url("<%= request.getContextPath() %>/images/'+this.folder.bgImage+'")'); 
     jQuery('#tw-show-folder .open-folder-header .open-folder-icon img').attr('src','<%= request.getContextPath() %>/images/icons/'+this.folder.icon); 
     jQuery('#tw-show-folder .open-folder-title').html(this.folder.title); 

     this.jqmdialog.jqm({ modal: false }); 

     this.show = function() { 
     this.jqmdialog.jqmShow(); 
} 
} 

    function AddFolderPopup() { 
    this.jqmdialog = jQuery('#tw-add-folder'); 
    this.jqmdialog.css('height','150px'); 
    this.jqmdialog.css('top','15%'); 
    this.jqmdialog.jqm({ modal: false }); 

try { 
    jQuery('#tw-add-folder .add-folder-update-icon').css('display','none'); 
    jQuery('#tw-add-folder .add-folder-save-icon').css('display','block'); 

    jQuery('#input-folder-title').val(''); 
    jQuery('#select-folder-icon').val('accept.png'); 
    jQuery('#select-folder-bgimage').val('folder_blue.png'); 
    jQuery("#select-folder-icon, #select-folder-bgimage").msDropDown(); 
} catch(e) { 
    alert(e.message); 
} 

this.show = function() { 
    this.jqmdialog.jqmShow(); 
} 

this.hide = function() { 
    this.jqmdialog.jqmHide(); 
} 
} 

    function ManageFoldersPopup(pTodoObj) { 
     this.jqmdialog = jQuery('#tw-manage-folders'); 
     this.jqmdialog.css('width','450px'); 
     this.jqmdialog.css('height','400px'); 
     this.jqmdialog.css('margin-left','-200px'); 
     this.jqmdialog.css('top','10%'); 
     this.jqmdialog.jqm({ modal: false }); 

      var folderTable = jQuery('#table-manage-folders'); 
     folderTable.empty(); 
     jQuery(pTodoObj.folders).each(function(index, folder) { 
     var result = '<tr id="'+'tfolder-'+folder.id+'">'; 

     result += '<td>'; 
     result += '<div style="background-image: url(\'<%= request.getContextPath() %>/images/'+folder.bgImage+'\');" class="folder-image">'; 
     result += '<span class="folder-icon"><img src="<%= request.getContextPath() %>/images/icons/'+folder.icon+'" width="40" height="40" /></span>'; 
     result += '<span class="folder-title">'+folder.title+'</span>'; 
     result += '<span class="folder-item-number">'+folder.items.length+'</span>'; 
     result += '</td>'; 

     result += '<td>'; 
     result += '<a class="edit_folder" href="#"><img src="<%= request.getContextPath() %>/images/icons/process.png" width="40px"/></a>'; 
     result += '</td>'; 

     result += '<td>'; 
     result += '<a class="delete_folder" href="#"><img src="<%= request.getContextPath() %>/images/icons/delete.png" width="40px"/></a>'; 
     result += '</td>'; 

     result += '</tr>'; 

     folderTable.append(result); 

     jQuery('#table-manage-folders #tfolder-'+folder.id+' .edit_folder').click(function() { 
     pTodoObj.editFolder(folder.id); 
    }); 

     jQuery('#table-manage-folders #tfolder-'+folder.id+' .delete_folder').click(function() { 
     pTodoObj.deleteFolder(folder.id); 
    });  
}); 

this.show = function() { 
    this.jqmdialog.jqmShow(); 
} 

this.hide = function() { 
    this.jqmdialog.jqmHide(); 
} 
    } 


    function EditFolderPopup(pFolder) { 
    this.jqmdialog = jQuery('#tw-add-folder'); 
    this.jqmdialog.css('height','150px'); 
    this.jqmdialog.css('top','15%'); 
    this.jqmdialog.jqm({ modal: false }); 

    try { 
    jQuery('#tw-add-folder .add-folder-update-icon').css('display','block'); 
    jQuery('#tw-add-folder .add-folder-save-icon').css('display','none'); 

    jQuery('#input-folder-id').val(pFolder.id); 
    jQuery('#input-folder-title').val(pFolder.title); 
    jQuery('#select-folder-icon').val(pFolder.icon); 
    jQuery('#select-folder-bgimage').val(pFolder.bgImage); 
    jQuery("#select-folder-icon, #select-folder-bgimage").msDropDown(); 
     } catch(e) { 
    alert(e.message); 
} 

this.show = function() { 
    this.jqmdialog.jqmShow(); 
} 

this.hide = function() { 
    this.jqmdialog.jqmHide(); 
} 
} 

    function QuickNotesPopup() { 
    this.jqmdialog = jQuery('#tw-quicknotes-popup'); 
    this.jqmdialog.css('width','445px'); 
    this.jqmdialog.css('height','300px'); 
    this.jqmdialog.css('margin-left','-220px'); 
    this.jqmdialog.jqm({ modal: false }); 

    jQuery('#quicknotes').tabify(); 

    this.show = function() { 
    this.jqmdialog.jqmShow(); 
} 

this.hide = function() { 
    this.jqmdialog.jqmHide(); 
} 
} 

回答

0

你做使用JQuery Ajax method到另一個JSP/servlet的回調用服務器,傳遞要作爲參數傳遞的信息。

爲了安全起見,請確保JSP返回帶錯誤代碼的答案,以確定傳輸是否正常。

+0

是的,但我不需要使用json序列化數據?事情是我想傳遞名爲folder和folderpopup的對象。 – samail 2011-05-01 19:38:45