如何将文本区域的内容发送到Typescript / Javascript / Html中的函数

时间:2014-09-16 15:24:05

标签: javascript html function typescript devextreme

可能是一个非常简单的问题,但我似乎找不到从textarea向javascript / typescript函数发送数据的方法。

HTML

  <div  data-options="dxContent : { targetPlaceholder: 'content' } " >
        <p> use this page to log errors</p>
        <p id="prevErrors" style="font-style:italic">PreviousErrors</p>
        <br />
        <div id="curError" data-bind="dxTextArea: { }"></div>
        <br />
        <div  data-bind="dxButton: { text: 'Save and return to main menu' }" onclick="    saveMyData(document.getElementById(curError).innerText)"></div>
    </div>

的Java /打字稿

<script>


        function saveMyData(curError) {
            //this will be where data is saved or emailed
            var today = new Date();
            var dd = today.getDate();
            var mm = today.getMonth() + 1; //January is 0!
            var yyyy = today.getFullYear();
            var h = today.getHours(); 
            var m = today.getMinutes(); 
            var s = today.getSeconds();
            if (dd < 10) {
                dd = '0' + dd
            }
            if (h < 10) {
                h = "0" + h;
            }
            if (s < 10)
            {
                s = "0"+s;
            }
            if (m < 10) {
                m = "0"+m;
            }
            if (mm < 10) {
                mm = '0' + mm
            }

            today = dd + '/' + mm + '/' + yyyy +" , "+h+":"+m+":"+s;
            prevErrors.innerText +=  "\n "+today+", "+curError;
        }
    </script>

最近才发现打字稿和javascript几乎完全相同,我觉得有点尴尬,启动打字稿就是这样一场战斗 - 没有像c#/ vb /等。

问题

我一直在尝试将此dxtextArea控件中的数据发送到函数。正如你所看到的,我已经尝试过使用 innerText ,但是,这似乎没有向函数发送任何内容(得到错误:

'Uncaught TypeError: Cannot read property 'innerText' of null', line 1, file 'http://localhost:51828/index.html#'.

即使textArea中存在数据。

任何人遇到这个问题/知道如何解决它/或者只是我对Java /打字稿知识的愚蠢和天真?

修改

我被告知要将我的方法调用从innerText更改为value(并在ID周围添加引号),但这仍然没有解决问题:

saveMyData(document.getElementById('curError').value)"

编辑2 我的完整剧本:

<div data-options="dxView : { name: 'ErrorLogging', title: 'ErrorLogging' } " >
    <div  data-options="dxContent : { targetPlaceholder: 'content' } " >
        <p>Use this page to log errors</p>
        <br />
        <p style="font-style:italic">PreviousErrors</p>
        <p id="prevErrors" style="font-style:italic"></p>
        <br />
        <div id="curError" data-bind="dxTextArea: { }" ></div>
        <br />
        <div  data-bind="dxButton: { text: 'Save and return to main menu' }" onclick="saveMyData(document.getElementById('curError').textContent)"></div>
    </div>
</div>
<script>

    function saveMyData(elem) {
        //this will be where data is saved or emailed


        var today = new Date();
        var dd = today.getDate();
        var mm = today.getMonth() + 1; //January is 0!
        var yyyy = today.getFullYear();
        var h = today.getHours(); 
        var m = today.getMinutes(); 
        var s = today.getSeconds();

        //add a '0' in front of single digit values
        if (dd < 10) {
            dd = '0' + dd
        }
        if (h < 10) {
            h = "0" + h;
        }
        if (s < 10)
        {
            s = "0"+s;
        }
        if (m < 10) {
            m = "0"+m;
        }
        if (mm < 10) {
            mm = '0' + mm
        }

        if (elem.textContent) {
            var curError = elem.textContent ?
                elem.textContent :
                elem.innerText;
        }
        alert(curError);

        today = dd + '/' + mm + '/' + yyyy +" , "+h+":"+m+":"+s; //created string containing todays' date and time
        prevErrors.innerText += "\n " + today + ", " + elem;

    }
</script>

Image of what it will look like on ios

2 个答案:

答案 0 :(得分:1)

我发现使用

var val = $("#textArea").dxTextArea("instance").option("value");

允许我获取名为textArea的ID,然后可以在没有方法/函数调用的情况下使用它。

现在,我可以使用代码:

prevErrors.innerText += "\n " + today + ", " + val;

能够将dxTextArea的输入输入到数据中。

问题解决了! :)

答案 1 :(得分:0)

有几件事要检查。

数字1 - 您必须确保在使用函数saveMyData之前声明它。你会知道如果你没有做到这一点,你会收到如下错误:

  

ReferenceError:未定义saveMyData

排名第2 - innerText非常棘手,但标准textContent在现代浏览器中通常是更好的选择。

document.getElementById('curError').textContent

注意 - textContent是IE9及更高版本(以及几乎所有其他浏览器)。要获得低于IE9的支持,您需要测试该功能!

如果您传递了元素,则可以在函数内部进行测试,这是一个可以运行的工作版本:

&#13;
&#13;
function saveMyData(elem) {
    if (elem.textContent) {
        var curError = elem.textContent ? 
            elem.textContent : 
            elem.innerText;
    }
    alert(curError);
}
&#13;
 <div  data-options="dxContent : { targetPlaceholder: 'content' } " >
        <p> use this page to log errors</p>
        <p id="prevErrors" style="font-style:italic">PreviousErrors</p>
        <br />
        <div id="curError" data-bind="dxTextArea: { }">Test Text</div>
        <br />
        <div  data-bind="dxButton: { text: 'Save and return to main menu' }" onclick="saveMyData(document.getElementById('curError'));">Click Me</div>
    </div>
&#13;
&#13;
&#13;