WebView抓取表单数据

时间:2012-01-20 14:44:42

标签: java javascript android html html5

我编写了一个混合应用程序,它是HTML5和Android代码之间的混合 - 它运行良好,但我遇到了一些问题。

我们的应用程序有一个人们会填写的表格(带有复选框和相应的数据以及评论部分)。此人可以单击每个复选框,但我需要填充所单击的项目,获取他们选择的数据以及他们所做的评论。

最好的方法是什么?供参考:数据仅列在表格中,每个表格的复选框数量会发生变化。尽管(或同一类)它们都与同一事物有关。

我已经编写了一个javascript界面​​,但是我遇到了解决表单数据最佳方法的问题。

谢谢!

           <form>
            <div id="colors">

                <table>
                    <tr>
                        <th>More header</th><th>NOHTING</th><th>Header</th><th></th>
                    </tr>
                    <tr>
                        <label for="checkbox1" id="checkbox-0">
                            <td class="stock">1261561</td>
                            <td class="etete">whatever</td>
                            <td class="gtgtg">random data</td>
                        </label>
                        <td class="add"><input type="checkbox" value="1" checked /></td>
                    </tr>
                    <tr>
                        <label for="checkbox2" id="checkbox-1">
                            <td class="stock">1261563</td>
                            <td class="etete">something</td>
                            <td class="gtgtg">details here</td>
                        </label>
                        <td class="add"><input type="checkbox" value="2" checked /></td>
                    </tr>
                    <tr>
                        <label for="checkbox3" id="checkbox-2">
                            <td class="stock">1261529</td>
                            <td class="etete">blah</td>
                            <td class="qtqtq">blah blah</td>
                        </label>
                        <td class="add"><input type="checkbox" value="3" checked /></td>
                    </tr>
                    <input type="hidden" id="hidden1" value="xxxxxx" />
                    <input type="hidden" id="hidden2" value="xxxxxxxxxx" />
                    <input type="hidden" id="hidden3" value="" />
                    <input type="hidden" id="fah21" value="x" />
                    <input type="hidden" id="asdf1" value="xxxx,xxx,xx" />
                </table>
            </div>
            <div id="footer">
                <textarea placeholder="Add Your Comments..."></textarea>
                <div id="cancel">
                    <img src="../images/cancel.png" height="50px" width="260px" onclick="goBack()">
                </div>
                <div id="save">
                    <img src="../images/save.png" width="260px" height="100px" onClick="parseForm()" />
                </div>
            </div>
        </form>

parseForm()是我无法弄清楚的。

类和数据的名称已更改。此外,当用户单击复选框时,将调用此脚本:

$(document).ready(function(){
  $('input[type=checkbox]').tzCheckbox({labels:['Add to whatever','Click to Add']});
});

javascript界面​​可以获取任何数据,无论是JSON,原始还是其他任何数据 - 我都会修复我的代码。

1 个答案:

答案 0 :(得分:1)

最简单的方法是包含一个JQuery函数,如下所示:

    $('form').submit(function() {
        Android.processFormData(decodeURIComponent($("form").serialize()));
        return false;
    });

在你的代码中有了这个,为它编写一个javascript界面​​并按如下方式附加它:

    webview.addJavascriptInterface(new JavaScriptInterface(), "Android");

然后在您的代码中添加以下内容:

private class JavaScriptInterface{
    JavaScriptInterface(){}
    JavaScriptInterface(Context c){}

    public void saveSheetAndClose(){
        webview.goBack();
    }

    public void processFormData(String data) {
            //I'm just splitting and spitting it out to the log. You'd need to write
            //a parser here.

        String[] tokens = data.split("[&]+");
        for (int i = 0 ; i<tokens.length; i++){

            if (tokens[i].contains("check")){
                //I use | in checkboxes to separate multidata
                String Checkbox[] = tokens[i].split("[|]+");

                tokens[i] = "check";
                Log.i("TokenSplit", " " + tokens[i]);
                for (int j=0; j<Checkbox.length; j ++)
                    if (!Checkbox[j].contains("check"))
                    Log.i("TokenSplit", "     " + Checkbox[j]);
                    //cheap way of removing check= if you have multiple values
            }else{
                Log.i("TokenSplit", "" + tokens[i]);
            }
        }
        saveSheetAndClose();
    }
}

注意,最好接受parseFormData()中的数据并将数据发送到ASync进程以防止UIThread锁定。一定要这样做!