Передача значения из viewmodel в скрипт в zk

Question

Я пытаюсь использовать PDFObject, чтобы показать pdf-файлы в строке. Приложение может содержать много файлов. Все файлы показаны в списке. При нажатии на любой из файлов, файл PDF должен быть доступен для просмотра, если браузер содержит плагин pdf или еще один тег привязки для загрузки файла.

Проблема у меня есть .. Я не мог понять, как передать имя файла из viewmodel в скрипт на странице zul.

Это то, что я сделал до сих пор ..

<?page title="Auto Generated index.zul"?> 
<?script type="text/javascript" src="pdfobject.js"?> 
<window title="Hello World!!" border="normal" width="200px"  apply="org.zkoss.bind.BindComposer" 
viewModel="@id('vm') @init('com.shahukhalroshan.vm.DemoViewModel')" xmlns:w="http://www.zkoss.org/2005/zk/client"> 
<button label="ok" w:onClick="embedPDF()" /> 
<script type='text/javascript'> 
    function embedPDF(){ 
    var myPDF = new PDFObject({ 
     url: 'abc.pdf' 
    }).embed(); 
    } 
    window.onload = embedPDF; //Feel free to replace window.onload if needed.  
</script> 
    <div> 
     It appears you don't have Adobe Reader or PDF support in this web 
     browser. <a href="abc.pdf">Click here to download the PDF</a> 
    </div> 
</window> 

Answer 1

В этом fiddle вам пример на динамическую нагрузку, используя PDFObject. Я только сделал небольшие изменения в вашем коде. Проблема: контейнер PDF, кажется, имеет фиксированную высоту 150px, но я уверен, что вы можете найти некоторые твики теперь :-)

Index.zul

<?script type="text/javascript" src="http://pdfobject.com/scripts/pdfobject.js"?> 
<zk> 
    <script type='text/javascript'> 
    function embedPDF(_url){ 
    var myPDF = new PDFObject({ 
     url: _url 
    }).embed('pdfContainer'); 
    } 
</script> 

    <vlayout apply="org.zkoss.bind.BindComposer" viewModel="@id('vm') @init('pkg$.TestVM')" xmlns:w="http://www.zkoss.org/2005/zk/client"> 
    <listbox model="@load(vm.pdfUrls)"> 
     <template name="model" var="url"> 
     <listitem> 
      <listcell label="@load(url)" /> 
      <listcell> 
      <button label="load" onClick="@command('loadPdf', url=url)" /> 
      </listcell> 
     </listitem> 
     </template> 
    </listbox> 
    <vlayout xmlns:n="native"> 
     <n:object id="pdfContainer"></n:object> 
    </vlayout> 
    </vlayout> 
</zk> 

TestVM.java

import org.zkoss.bind.annotation.AfterCompose; 
import org.zkoss.bind.annotation.Command; 
import org.zkoss.bind.annotation.BindingParam; 
import java.util.List; 
import java.util.ArrayList; 
import org.zkoss.zk.ui.util.Clients; 

public class TestVM { 

    List<String> pdfUrls; 

    @AfterCompose 
    public void afterCompose() { 
     pdfUrls = new ArrayList<String>(); 
     pdfUrls.add("http://www.pdf995.com/samples/pdf.pdf"); 
     pdfUrls.add("https://partners.adobe.com/public/developer/en/xml/AdobeXMLFormsSamples.pdf"); 
     pdfUrls.add("https://www.iscp.ie/sites/default/files/pdf-sample.pdf"); 
    } 

    @Command 
    public void loadPdf(@BindingParam("url")String url) { 
     Clients.evalJavaScript("embedPDF('"+ url +"')"); 
    } 

    public List<String> getPdfUrls() { 
    return pdfUrls; 
    } 

} 

Cheers, Алекс