ModalPopup или диалоговое окно с использованием Google Closure

При нажатии на ссылку «добавить сотрудника» должно появиться всплывающее окно с полями для принятия данных пользователя. Я пробовал много вещей, но в итоге открыл новое окно, а не всплывающее окно. как заставить следующий код работать во всплывающем окне, диалоговом окне или ModalPopup

function newUsr() {
    var li = new goog.ui.LabelInput('Employee ID');
    li.render(goog.dom.getElement('d'));
    var li1 = new goog.ui.LabelInput('First Name');
    li1.render(goog.dom.getElement('d1'));
    var li2 = new goog.ui.LabelInput('Last Name');
    li2.render(goog.dom.getElement('d2'));
    var li3 = new goog.ui.LabelInput('Email Id');
    li3.render(goog.dom.getElement('d3'));
    var li4 = new goog.ui.LabelInput('Date Of Birth(yyyy-mm-dd)');
    li4.render(goog.dom.getElement('d4'));
    var li5 = new goog.ui.LabelInput('Date Of Joining(yyyy-mm-dd)');
    li5.render(goog.dom.getElement('d5'));
    var li6 = new goog.ui.LabelInput('Phone');
    li6.render(goog.dom.getElement('d6'));
    var fb1 = new goog.ui.Button('Submit', goog.ui.FlatButtonRenderer
            .getInstance());
    fb1.render(goog.dom.getElement('fb1'));
    goog.events.listen(fb1, goog.ui.Component.EventType.ACTION, function(e) {
        alert(" " + li.getValue() + " " + li1.getValue() + " ");
        var request = new goog.net.XhrIo();
        var data = new goog.Uri.QueryData();
        data.set('emp_id', li.getValue());
        data.set('first_name', li1.getValue());
        data.set('last_name', li2.getValue());
        data.set('email', li3.getValue());
        var d1 = new Date(li4.getValue());
        var d2 = new Date(li5.getValue());
        data.set('dob', li4.getValue());
        data.set('doj', li5.getValue());
        data.set('phone', li6.getValue());
        request.send('newUser', 'POST' , data.toString());
    });
}
Date.prototype.yyyymmdd = function() {         

    var yyyy = this.getFullYear().toString();                                    
    var mm = (this.getMonth()+1).toString(); // getMonth() is zero-based         
    var dd  = this.getDate().toString();             

    return yyyy + '-' + (mm[1]?mm:"0"+mm[0]) + '-' + (dd[1]?dd:"0"+dd[0]);
};  

person Arjun    schedule 04.10.2013    source источник


Ответы (1)


Пожалуйста, покажите нам, как вы создаете и обрабатываете ссылку «добавить сотрудника», иначе сложно ответить на вопрос. Если вы прикрепили прослушиватель событий для события goog.events.EventType.CLICK к ссылке, а поведение ссылки по умолчанию — открыть новое окно (т. е. оно имеет свойство target), то вы можете предотвратить поведение по умолчанию, используя preventDefault(). Внутри вашего обработчика событий вы можете открыть пользовательский диалог, например. используя goog.ui.Popup или goog.ui.Dialog.

Например:

<a href="someurl" id="add">add employee</a>

и ты сделал

goog.events.listen(document.getElementById('add'), goog.events.EventType.CLICK, function(e) {e.preventDefault(); e.stopPropagation(); var dlg = new goog.ui.Dialog(); ...});
person Kiran    schedule 07.02.2014