将 liferay-ui:input-localized XML 更改为 javascript

Change liferay-ui:input-localized XML with javascript

我的 view.jsp 中有以下标签:

<liferay-ui:input-localized id="message" name="message" xml="" />

而且我知道我可以设置 XML 并在输入本地化时设置默认值。我的问题是我想用 javascript 更改此属性。我正在监听一些变化并调用函数“update()”来更新我的信息:

function update(index) {
    var localizedInput= document.getElementById('message');
    localizedInput.value = 'myXMLString';
}

更改值只会更新当前选择的语言输入(使用整个 XML 字符串)。 XML 字符串是正确的,但我不确定如何使用 javascript.

更新输入的 XML

这可能吗?

PS:我已将此张贴在 Liferay Dev forum 中以尝试吸引更多人。

要更改元素的文本值,您必须更改元素的文本节点的值。

例子-

xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue = "new content"

假设“books.xml”被加载到 xmlDoc

获取元素的第一个子节点

将节点值更改为“新内容”

经过一周的案例研究和一些测试后,我认为我找到了解决此问题的方法。不确定这是否是正确的方法,但它对我有用,所以我将post我当前的解决方案以供将来参考。

检查 HTML 后,我注意到 Liferay-UI:input-localized 标签创建了一个 input[=默认为 20=] 标签,然后为每种语言再输入一个标签,每次 select 一种新语言。知道我用 Javascript 创建了一些函数来帮助我更新从 liferay-ui:input-localized 创建的输入。相关代码如下:

function updateAnnouncementInformation(index) {
    var announcement = announcements[index];

    // the announcement['message'] is a XML String
    updateInputLocalized('message', announcement['message']);
}

function updateInputLocalized(input, message) {
    var inputId = '<portlet:namespace/>' + input;
    var xml = $.parseXML(message);
    
    var inputCurrent = document.getElementById(inputId);
    var selectedLanguage = getSelectedLanguage(inputId);
    
    var inputPT = document.getElementById(inputId + '_pt_PT');
    inputPT.value = $(xml).find("Title[language-id='pt_PT']").text();
    
    var inputEN = document.getElementById(inputId + '_en_US');
    if (inputEN !== null) inputEN.value = $(xml).find("Title[language-id='en_US']").text();
    else waitForElement(inputId + '_en_US', inputCurrent, inputId, xml);
    
    var inputLabel = getInputLabel(inputId);
    if (selectedLanguage == 'pt-PT') inputLabel.innerHTML = '';
    else inputLabel.innerHTML = inputPT.value;
    
    if (selectedLanguage == 'pt-PT') inputCurrent.value = inputPT.value;
    else if (inputEN !== null) inputCurrent.value = inputEN.value;
    else waitForElement(inputId + '_en_US', inputCurrent, inputId, xml);
}

function getSelectedLanguage(inputId) {
    var languageContainer = document.getElementById('<portlet:namespace/>' + inputId + 'Menu');
    return languageContainer.getElementsByClassName('btn-section')[0].innerHTML;
}

function getInputLabel(inputId) {
    var boundingBoxContainer = document.getElementById(inputId + 'BoundingBox').parentElement;
    return boundingBoxContainer.getElementsByClassName('form-text')[0];
}

function waitForElement(elementId, inputCurrent, inputId, xml) {
    window.setTimeout(function() {
        var element = document.getElementById(elementId);
        if (element) elementCreated(element, inputCurrent, inputId, xml);
        else waitForElement(elementId, inputCurrent, inputId, xml);
    }, 500);
}

function elementCreated(inputEN, inputCurrent, inputId, xml) {
    inputEN.value = $(xml).find("Title[language-id='en_US']").text();
    
    var selectedLanguage = getSelectedLanguage(inputId);
    if (selectedLanguage == 'en-US') inputCurrent.value = inputEN.value;
}

有了这个,我可以根据 pre-built XML 字符串更新 liferay-ui:input-localized 输入。我希望有人觉得这很有用,如果你有什么要补充的,请告诉我!