Hi I have suppose two html files as index.html and test.html. In index.html I have one button on click of that button I call test.html. In test.html I am displaying a table. Now my index.html is like:
<div data-role="page" id="home" data-theme="d">
<div data-role="header" align="center">
Back
<h1>MySite.com</h1>
Menu
</div>
<div data-role="content" >
i ndex
<ul data-role="listview" data-inset="true">
<li> Order Book </li>
</ul>
</div>
</div>
Now onclick of button and on list I go to test.html, and table is displayed correctly. In my test.html there is a header and in that I have back button as:
<div data-role="header" align="center">
Back
<h1>Test.com</h1>
Menu
</div>
Now when I click on back button It does not go to index.html. If I remove data-ajax="false" from index.html then back button of test.html works fine, but now in test.html I am using .css file for my table and here now effect of that .css file is not applied. IF I use data-ajax="false" in index.html then on Test.html table is properly drawn (means my .css file load correctly). How I can get proper back button and table at same time.
Any suggestion will be appreciated. Thanks in advance.
When you use data-jax="false" you are disabling jquery mobile's Ajax navigation, therefore the page you are linking to does not have access to the previous page in the DOM.
To have the back button on the second page, you need to hard-code it into the header, using a traditional <a href="..." link, or code it to pull the previous page from your DOM.
Related
I need to embed a marketo form onto a github page, essentially host it there, then iframe it into another piece of software I'm using. The iframing in afterwards is striaght forward as the software does that. But I cant work out how to actually embed it on github.
Go to the Marketo form
Grab the form embed code
Grab the munchkin tracking code too. Not 100% essential but needed if you want web page tracking on the Github page the form will live on.
Drop code in a Div section.
From my code example you could replace 132 (with your actual form ID)
And replace 111-AAA-111 wit your Munchkin ID.
Example
<div data-role="page" id="page_1">
<div data-role="header">
<h1>Test form. Embedded</h1>
</div>
<div data-role="main" class="ui-content">
<script src="//app-abj.marketo.com/js/forms2/js/forms2.min.js"></script>
<form id="mktoForm_123"></form>
<script>MktoForms2.loadForm("//app-abj.marketo.com", "111-AAA-111", 123);</script>
</div>
<div data-role="footer">
<h1>Footer: text</h1>
</div>
</div>
I have a php based webpage and inside it iframe with another webpage. Parent contains list of items, and iframe contains page that will add/edit the list, save it to DB and send a js message to parent page (list) to update list without reloading parent page (a litle bit more complicated then that, but that is the core idea).
//html parent page basic content
<head>
<script>
function alert_me(){
alert('IT\'S ALIVE!');
}
<script>
</head>
<body>
<iframe src='child_page.html'></iframe>
</body>
And now the child page.
<head>
<script>
$(document).ready(function(){
//this is not working and this is what I want (auto call function after reload child)
window.top.alert_me();
//I tried autoclick button but it's not working either
$('.alert_me_button').trigger('click');
});
</script>
</head>
<body>
<!-- this is working just fine, so I know the code itself is ok -->
<a href="#" class="alert_me_button" onclick="window.top.alert_me();" >Click me to alert me</a>
</body>
As you see It works fine when user click the button callij js funtion, but it will not work the I don't want any user action. I triend , documnt.ready()... even setInterval() to pause the script to be sure it's not timing issue. Any ideas?
The code works just fine.
What browser are you using. I just copied your code and added jquery from cdn. I used SimpleHttpServer to serve the pages and avoid the cross origin blocking.
After reloading I got the message twice both in Chrome and Firefox as well.
We try to do scape for a web page after login. In this website menu use javascript code as below to go to other website pages.
<div id="mCSB_2_container" class="mCSB_container" style="position:relative; top:0; right:0;" dir="rtl">
<ul id="ctl00_ulUserMenu" class="menu">
<li id="divMenuItem_1">
<a href="#" onclick="javascript:__doPostBack('MenuItemRedirect','UsersManagement/UserInfoManagement.aspx');">بياناتي الشخصية
</a></li>
When we try to access using full URL (appears in a browser after the targeted page load) https://*******/UsersManagement/UserInfoManagement.aspx , I can't reach the same page and I got the below error msg.
any suggestion is highly appreciated.
Thanks
I have my nav.html file that contains the navbar. How can I decide when the rest of the data goes?
because when I load my navbar as follow:
<body>
<div id="navbar">
</div>
<div id="page-wrapper">
</div>
</body>
<script>
$(function(){
$("#navbar").load("./navbar/index.html");
});
</script>
the content of the navbar is covering the content of page-wrapper
how can I load the navbar and the content of the page together without messing up the page content?
If I understand your question correctly, it sounds like you are just having a styling issue. Just make some tweaks to your CSS or inline page styling and you will fix this issue.
I'm using OnePageScroll.js for my Drupal website but somehow the Javascript file isn't doing anything. Everything is perfectly imported, even the .js file. I put an alert box in it and it works but somehow he doesn't do the rest.
Link to OnePageScroll.js
<section class="page1">
<div class="page_container">
<h1>One Page Scroll</h1>
</div>
</section>
<section class="page2">
<div class="page_container">
<h1>One Page Scroll2</h1>
</div>
</section>
When I open it in a simple .html file then I have result but when I upload it to my server to my Drupal website then it doesn't do anything. I noticed the JS file doesn't add the extra class to certain divs..
edit:
The jQuery files I added:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
I would say you have not linket the jQuery files correctly. Plain alert works even if you do not have jQuery linked because it is plain javascript. Try to alert the following in order to find out:
alert($("div:first").text());