Wednesday, August 7, 2013

Copy data into clipboard in ZK Framework using java script

  <zk xmlns:x="xhtml" xmlns:zk="zk">
    <window apply="org.zkoss.bind.BindComposer"
        viewModel="@id('vm') @init('com.test.TestViewModel')">
       <script type="text/javascript">
            <![CDATA[

            function f_Copy_ClipBoard() {

            var firstNumber = document.getElementById("FirstNumber").value;
            var secondNumber = document.getElementById("SecondNumber").value;
           
            if (window.clipboardData) {
            window.clipboardData.setData("Text", firstNumber+" And "+secondNumber);
               }
            }
            ]]>
           </script>
        <x:table width="100%">
            <x:tr>
                <x:td>
                    <label value="First Number" />
                </x:td>
                <x:td>
                    <x:input id="FirstNumber"
                        value="@bind(vm.FirstNumber)" />
                </x:td>
                <x:td>
                    <label value="Second Number" />
                </x:td>
                <x:td>
                    <x:input id="SecondNumber"
                        value="@bind(vm.SecondNumber)" />
                </x:td>
                <x:td>
                    <x:input type="button" value="Sum"
                        onclick="f_Copy_ClipBoard();" />
                </x:td>
            </x:tr>
        </x:table>
    </window>
</zk>

  In TestViewModel.java create below two attributes.

    private String FirstNumber;
    private String SecondNumber;

    public String getFirstNumber() {
        return FirstNumber;
    }

    public void setFirstNumber(String firstNumber) {
        FirstNumber = firstNumber;
    }

    public String getSecondNumber() {
        return SecondNumber;
    }

    public void setSecondNumber(String secondNumber) {
        SecondNumber = secondNumber;
    }

Note: The clipboardData object is only supported by Internet Explorer.

No comments:

Post a Comment