Jump to content

Problem Whit Automatic Change Of The Content In An <Div> By Clicking A Button + Changing The Url Using Ajax - An Easy Ajax Cms


Recommended Posts

Posted

Hi it me again

sorry to ask but I have a huge Problem and need help very fast…

I am building a Website for a friend whit both a “mobile” and a “normal” version.

 

I am new to programing any language. So I have almost no experience whit it...

 

I know you normally you would use a CMS like drupal etc. but I don’t like them so…

So I knew of the Ajax method using JavaScript so I wanted to use that method to build a simple CMS to swap the content whit “articles” in a folder on the server.

So loading a single site is no problem…

jQuery - AJAX load() Method or Load page to a div jQuery Mobile

So back in the internet I found this method: It changes the div content and adds a #page name to the URL:

How to load content with back button enable and refresh using Ajax

the script:

 

<!DOCTYPE html>
<html>
<head>
 <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.js"></script>
 <script type="text/javascript">
 $(function(){
// part 1
 $('menu a').click(function(){
 location.hash=$(this).attr('href').match(/(^.*)\./)[1]
 return false
 })
// part 2
 var originalTitle=document.title
 function hashChange(){
 var page=location.hash.slice(1)
 if (page!=""){
 $('#content').load(page+".html #sub-content")
 document.title=originalTitle+' – '+page
 }
 }
// part 3
 if ("onhashchange" in window){ // cool browser
 $(window).on('hashchange',hashChange).trigger('hashchange')
 }else{ // lame browser
 var lastHash=''
 setInterval(function(){
 if (lastHash!=location.hash)
 hashChange()
 lastHash=location.hash
 },100)
 }
 })
 </script>
 <title>main</title>
</head>
<body>
<menu>
 <li><a class="menu_links" href="newproject.html">New Project</a></li>
 <li><a class="menu_links" href="accord.html">Accordion</a></li>
 <li><a class="menu_links" href="project_summary.html">Summary Table</a></li>
 <li><a class="menu_links" href="detail_report.html">Detail Report</a></li>
 <li><a class="menu_links" href="upload_data.html">Upload Data</a></li>
</menu>
<div id="content"></div>
</body>
</html>

And in the demo (link) it works well.

But for some reason I’m not getting it to work whit my own Site…

 

Could someone please help me by explaining how I have to set all the <div> so that I can build the rest of my site?

I know I am asking allot… But please help me…

 

And thanks for reading this Question and answering my questions

p.s. sorry for my bad English.

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...