New Topic/Question
Reply
I've recently added jQuery AJAX into my page, in order to submit the form. This partly, was to save the pointless validation of the client side to only have to do the exact same code server-side. But also because I feel it's better for the particular site.
Anyway, I have TinyMCE installed, and everything appears to work - until I come to submit the page via AJAX, nothing gets submitted from the textarea. When I remove the TinyMCE code from the page, it works perfectly, so somehow it's conflicting with the AJAX function when submitting.
I think I probably know why, it's because it's generating it dynamically and there is no value there. But it's really making me frustrated, I need a WYSIWYG editor because not all the staff members who use the page know any kind of HTML.
There are far too many parts of the editor to post here, so I've had to zip them up in an archive. I can't expect people to go through and check all that, but I would appreciate it if people looked at some of it. I've read of people having similar problems, but no-one seems to have found a solution. I'm fairly new to proper jQuery AJAX anyway, and this has made things far more complex for me than I'm assuming they need to be.
My future ambitions are to combine all these AJAX requests into one function that can be called with the relevant parameters, but I'd much rather take this one step at a time for the moment, I'm still learning.
Below I'm posting my AJAX code. My question is, is there some way I can stop this from conflicting, or introduce a new WYSIWYG editor that won't conflict in the same way? I really need one because it's unreasonable for me to expect the staff all learn HTML.
jQuery (only relevant code has been posted)
/* jQuery Functions */
$(document).ready(function(){
$("#add_page").click(function()
{
add_page();
});
});
function add_page()
{
var title = $("#title").val();
var description = $("#description").val();
var section = $("#section").val();
var type = $("#type").val();
var youtube = $("#youtube").val();
var username = $("#username").val();
var rating = $("#rating").is(':checked') ? 1 : 0;
var show_staff = $("#show_staff").is(':checked') ? 1 : 0;
var content = $("textarea#page_content").val();
var tags = $("#tags").val();
var sub_page = $("#sub_page").val();
var parent = $("#parent").val();
var previous = $("#previous").val();
var next = $("#next").val();
$.post("index.php?module=actions&action=new_page",
{
title: title,
description: description,
section: section,
type: type,
youtube: youtube,
username: username,
rating: rating,
show_staff: show_staff,
content: content,
tags: tags,
sub_page: sub_page,
parent: parent,
previous: previous,
next: next,
},
function(data, status)
{
if (data != '')
alert(data);
else
$(".ajax_response").slideDown();
});
}
HTML
<script language="javascript" type="text/javascript" src="js/tiny_mce.js"></script>
<script language="javascript" type="text/javascript">
tinymce.init({
theme : "advanced",
mode : "textareas",
plugins : "advhr, advlist, autosave, directionality, inlinepopups, paste, save, xhtmlxtras, advimage, preview, tabfocus, layer, spellchecker, table, wordcount",
theme_advanced_buttons3_add : "advhr, cite, ins, del, abbr, acronym",
extended_valid_elements : "hr[class|width|size|noshade]",
tools: "inserttable",
toolbar: "save, preview, spellchecker, ltr rtl",
dialog_type : "modal",
save_enablewhendirty: true,
save_onsavecallback: function() {console.log("Save");}
});
</script>
<script type="text/javascript">
function textCounter(field, countfield, maxlimit)
{
if (field.value.length > maxlimit)
{
field.value = field.value.substring(0, maxlimit);
field.blur();
field.focus();
return false;
}
else
countfield.value = maxlimit - field.value.length;
}
</script>
<div class="acp-box">
<h3>Page Wizard</h3>
</div>
<br />
<div class="ajax_response">Page added succesfully</div>
Article Title: *<br />
<input class="text" id="title" size="40" /><br /><br />
Article Summary: *<br />
<input class="text" id="description" size="40" /><br /><br />
Article Section: *
<br /><select id="section">
<option value="Stronghold 1">Stronghold 1</option><option value="Stronghold Crusader">Stronghold Crusader</option><option value="Stronghold 2">Stronghold 2</option><option value="CivCity Rome">CivCity Rome</option><option value="Stronghold Legends">Stronghold Legends</option><option value="Stronghold Kingdoms">Stronghold Kingdoms</option><option value="Stronghold 3">Stronghold 3</option><option value="Stronghold Crusader 2">Stronghold Crusader 2</option> </select><br /><br />
Article Type:<br /><select id="type">
<option value="gameinfo">Game Information</option><option value="tutorials">Tutorial</option><option value="walkthroughs">Walkthrough</option> </select><br /><br />
YouTube Video<br />
<input class="text" placeholder="Paste embedded code..." id="youtube" size="40" /><br /><br />
You can specify another user who has written this article here:<br />
<input type="text" class="text" id="username" placeholder="Written by user..." />
<br /><br />
Allow Ratings <input type="checkbox" value="1" id="rating" checked="checked" />
<br /><br />
Show Staff Details <input type="checkbox" value="1" id="show_staff" checked="checked" />
<br /><br />
<textarea class="text" id="page_content" name="content" cols="50" rows="20"></textarea>
<br /><br />
Page Tags:<br /><input class="text" placeholder="tag 1, tag2, tag_3" type="text" id="tags" name="tags" maxlength="100" size="40" onblur="textCounter(this,this.form.counter,100);" onkeyup="textCounter(this,this.form.counter,100);">
<input class="text" onblur="textCounter(this.form.recipients,this,100);" disabled="disabled" onfocus="this.blur();" tabindex="999" maxlength="3" size="3" value="100" name="counter">
<br /><br />
Page type: *<br />
<select id="sub_page">
<option value="normal_page">Normal Page</option>
<option value="sub_page">Sub-Page</option>
<option value="sub_sub_page">Sub-Sub-Page</option>
</select>
<br /><br />A normal page will appear in the main area where you choose to read articles, and searches. A sub page will not appear in the main area where you choose articles, but will appear in searches and a sub sub page will appear in neither.<br /><br />
Parent Page: <br />
If you want to, you can make this page a sub-page by adding the full URL of a parent page of your choice here.
<br />
<input class="text" type="text" id="parent" size="60" />
<br /><br />
Previous Article: <br />
If this is a walkthrough, or has multiple pages, you can include a previous page here. Paste the full URL (or article ID) to do so.
<br />
<input class="text" id="previous" type="text" size="60" />
<br /><br />
Next Article: <br />
If this is a walkthrough, or has multiple pages, you can include a "next" page here. Paste the full URL (or article ID) to do so.
<br />
<input class="text" id="next" type="text" size="60" />
<br /><br />
<button class="button primary" type="button" id="add_page">Add Article</button>
</div>
</div>
</div>
Attached File(s)
-
langs.zip (327.96K)
Number of downloads: 111
MultiQuote
| 