javascript - XPage:如何获取元素值CSJS

Question

使用引导应用程序布局，我一直在尝试获取元素的值但无法这样做，我尝试了几个代码，例如

XSP.getElementById("#{id:elementName}").value
$("#{id:elementName}").val()
x$("#{id:elementName}").val()
dojo.byId("#{id:elementName}").value

但是这四个都不起作用，我如何从客户端获取元素的值

Answer 1

2 件需要检查的事情。

1. XSP.getElementById("#{id:elementName}") 代码是否正确查找元素？注意:您应该在此处使用服务器端控件 ID，而不是任何其他属性，例如名称不起作用。如果您尝试按名称执行此操作，那么您应该使用其他方法。

2. 您想要获取什么类型的元素？如果它是文本输入，那么您可以使用 .value 但如果它是选择或其他类型的控件，则可能是不同的方法/属性

要检查您是否正确找到该元素，请尝试以下操作(在 CSJS 按钮事件中):

var el = XSP.getElementById('#{id:serverSideControlId}');
console.log(el);

单击按钮，然后在浏览器中检查 JavaScript 控制台，您应该在控制台上看到代表您的元素的某种信息，例如:

<input type="text" name="view:_id1:inputText1" id="view:_id1:inputText1">

如果找不到该元素，那么您的 id 一定是错误的，您将看到 null

一旦您确定您正在获取该元素，那么您可以尝试使用 XSP.getFieldValue(node) 函数，我认为该函数内部有一些智能，可以根据类型正确查找值元素。

// Note that you pass in the element that you retrieved already, and not the id
var val = XSP.getFieldValue(el);

这是一个带有输入文本的工作示例:

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">

    <xp:inputText id="inputText1" value=""></xp:inputText>

    <xp:button value="Get Element Value" id="button1">
        <xp:eventHandler event="onclick" submit="false">
            <xp:this.script><![CDATA[

        var el = XSP.getElementById('#{id:inputText1}');

        // Check your javascript console in your browser
        console.log(el);

        var val = XSP.getFieldValue(el);

        // Check the contents of the value 
        console.log(val);

        ]]></xp:this.script>
        </xp:eventHandler>
    </xp:button>


</xp:view>