Kane Posted August 7, 2012 Report Share Posted August 7, 2012 I am using a V130 series OPLC and I am working on an Advanced Web Server that will be mobile friendly. I like the simplicity of jquery and the power of ajax. I am currently only able to get the HTML to display from the web server. I am referencing the jquery files that are placed under Web on the SD card but they do not seem to load and the browser will hang for a bit before it loads the html without the jquery style sheets and structure. Any ideas? Comments? Also I am looking for examples of users updating operands with AJAX. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>AgriNomix Production Management</title> <link href="jquery.mobile.theme-1.0.min.css" rel="stylesheet" type="text/css"/> <link href="jquery.mobile.structure-1.0.min.css" rel="stylesheet" type="text/css"/> <script src="jquery-1.6.4.min.js" type="text/javascript"></script> <script src="jquery.mobile-1.0.min.js" type="text/javascript"></script> </head> <body> <div data-role="page" id="page"> <div data-role="header" data-theme="a"> <h1>AgriNomix Production Management System</h1> </div> <div data-role="content" data-theme="c"> <ul data-role="listview" data-split-icon="plus"> <li><a href="#Live">Live Feed</a></li> </ul> </div> <div data-role="footer"> <h4>For Questions Please Contact AgriNomix at </h4> </div> </div> <div data-role="page" id="Live"> <div data-role="header"> <h1>Live Feed</h1> </div> <div data-role="content"> [MI3,0,1,0] </div> <div data-role="footer"> <h4>For Questions Please Contact AgriNomix at </h4> </div> </div> </body> </html> Its just a stripped version of what the code looks like but you should be able to get the picture. Thanks. Link to comment Share on other sites More sharing options...
Kane Posted August 8, 2012 Author Report Share Posted August 8, 2012 Well I found my own solution for the jquery issue. Since for some reason I was not able to figure out the source link to grab the jquery files locally. I went the CDN-hosted route. Several websites claim that this is the way to go and no one should ever host it locally. Idk. The webpage is loading very quickly operands loading just fine. Now if any one has any feed back on AJAX that will be helpful and of course if I make any progress I will be happy to share. <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" /> <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script> Link to comment Share on other sites More sharing options...
Kane Posted August 10, 2012 Author Report Share Posted August 10, 2012 Well after doing some reading and research. I came up with a way to integrate AJAX and refresh the operands without refreshing the page like the enhanced web server.pdf wants you to do with a <meta> command. It works pretty well sometimes a little slow. I am looking to see if I can make it more stable and responsive. I believe I read some where on the forums that if i separate the JavaScript into its own file it may work better. Hope this helps others that are looking to do a similar application. Also still looking for tips and tricks for improvements or if anyone has any questions let me know. <Header> <script type="text/javascript"> var auto_refresh = setInterval( function () { $('#Content').load('/Web/Start.htm #Content').fadeIn("slow"); }, 200); // refresh every 200 milliseconds </script> </Header> <body> <Div data-role="content" id="Content"> [MI3,1,0] </DIV> Link to comment Share on other sites More sharing options...
Flavien Posted August 10, 2012 Report Share Posted August 10, 2012 Thanks a lot for your example, Kane. It works very well and it is easy to use! Please feel free to add more information when you improve this function. Link to comment Share on other sites More sharing options...
martin988 Posted May 27, 2016 Report Share Posted May 27, 2016 Hello, Can mobile responsive applications be done on the Unistream PLC WEB server too? Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now