בניתי מערכת תגובות ולפני יומיים הוספתי לה עורך FCKditor לתגובות.

הבעייה היא שהתוכן של התגובה עצמה הוא ריק אבל התגובה נשלחת, כלומר עורך הFCK לא מחזיר לי את התוכן שלו.

אני צריך לקבל משתנה בשם text ע"י POST.

אם אני יוצר תיבת טקסט בשם text אני אכן מקבל את התוכן. אבל אם אני יוצר תיבת תוכן עשירה אני לא מקבל את התוכן. הגדרתי את התיבה כך כפי שמתואר באתר שלהם

קוד PHP:

 <script type="text/javascript">
var oFCKeditor = new FCKeditor('text');
oFCKeditor.BasePath = "/fckeditor/";
oFCKeditor.Width = "400" ;
oFCKeditor.ToolbarSet = 'Basic' ;
oFCKeditor.heigth = "120" ;
oFCKeditor.Create();
</script> 


כאן כתוב כיצד להוסיף:
http://docs.fckeditor.net/FCKeditor...tion/JavaScript

הנה העמוד שלי עם התגובות (עשיתי כמה תגובות נסיון ואפשר לראות שהן ריקות)
http://uzone.co.il/index.php?page=guide&id=130

תודה לכולם

הקוד הנ"ל נמצא ב-body?

ד"א, למה שלא תשאל בפורום שלהם? אני מניח שהם יודעים הרבה יותר טוב ..

אפשר לנסות בעצמנו באתר שלך?

ציטוט:

הבעייה היא שהתוכן של התגובה עצמה הוא ריק אבל התגובה נשלחת, כלומר עורך הFCK לא מחזיר לי את התוכן שלו.

באיזה מצב?
לאחר ניסיון שליחה?

כן , אפשר לנסות שם...

לאחר השליחה לא מתקבל כלום.

גם הדפסתי את הטקסט לאחר השליחה (בעת עמוד המעבר) כדי לוודא שהתוכן נשלח לבסיס הנתונים (שהפלט של העורך לא משבש משהו בבסיס הנתונים) . אבל הפלט של העורך ריק לגמרי

כלומר

קוד PHP:

 $_POST['text'] 


ריק!

זה כותב לי שרק משתמשים רשומים יכולים לכתוב תגובה.

אפשר בבקשה משתמש ניסיון?

ד"א בבלוק שכותב "רק משתמשים רשומים יכולים להגיב במערכת", אולי כדאי שתוסיף קישור להרשמה והתחברות (שיהיה יותר נוח וקל למצוא אותם. לקח לי איזה רבע-דקה למצוא קישור להרשמה\התחברות)

תתחבר עם test
123456

אני עכשיו מתכנן לשפר את כל הקטע של התגובות. אני יוסיף גם קישור להרשמה.
מה שעוצר לי את ההתקדמות היא הבעייה הזו.

יש שתי דרכים להוספת העורך. דרך ראשונה כמו שעשיתי קודם ודרך שנייה הוספת קוד יחיד שיחליף את כל הtextarea בעמוד.

אז עשיתי את השיטה השנייה ומה שקורה זה שרק הtextarea הראשון שבעמוד מתחלף..

אני חושב שהבעייה (בשתי השיטות) היא שלכל הtextarea שאני רוצה ליצור יש את אותו שם שהו text.

מה אני יכול לעשות ? אני לא רוצה לשים לכל textarea שם אחר כי אז זה מסבך את עניין קבלת הנתונים מהטופס.

התחברתי עכשיו וניסיתי למצוא את העורך, אבל פשוט לא מצאתי...

קודם כל שמתי לב שאת הקוד הבא:

קוד:

<script type="text/javascript">
window.onload = function()
{
var allTextAreas = document.getElementsByTagName("textarea");
for (var i=0; i < allTextAreas.length; i++) {
    var oFCKeditor = new FCKeditor( allTextAreas[i].name ) ;
    oFCKeditor.BasePath = "/fckeditor/";
    oFCKeditor.Width = "400" ;
    oFCKeditor.ToolbarSet = 'Basic' ;
    oFCKeditor.heigth = "120" ;
    oFCKeditor.ReplaceTextarea() ;
  }
}
</script>

שמת בין תגי ה-body, במקום בין תגי ה-head כפי שכתוב שזה צריך להיות.

דבר שני, אין לך בכלל אלמנטים של textarea בעמוד!
לכן המשתנה allTextAreas בקוד הנ"ל שווה לכלום! כי הוא לא מוצא את התגים textarea שבכלל לא נמצאים בעמוד... ואז לא מתבצע חילוף...

דבר שלישי - הדרך הנ"ל תגרום לטעינה כבדה מאוד של העמוד שלך... מספיק עורך FCK אחד בשביל שהעמוד ייחשב ל-"כבד", אז כשאתה עושה מעל 2 עורכים כאלה בעמוד זה יכול להכביד מאוד... קח זאת בחשבון, אם אתה רוצה נוחות...
הצעה שלי לדרך חלופית: כאשר לוחצים על תגובה למשתמש מסוים, בעזרת JS זה יערוך שדה input מסוג hidden וישנה את ערכו לערך ה-id של מי שמגיבים לו.
ועורך ה-FCK יהיה בחלק התחתון בעמוד, מתחת לכל התגובות.

אני בדיוק עכשיו עורך כמה שינויים. בגלל זה אין TEXAAREA

אחרי קצת מחשבה הגעתי למסקנה שממש לא משתלם לי להחליף כל TEXTAREA בעורך.

יכולות להיות בעמוד הזה עשרות עד מאות תגובות. מה שייצור עשרות עד מאות עורכי תוכן מה שיגרום לעמוד להיטען במשך שעות.

החלטתי ליצור TEXTAREA אחד שיקפוץ כאשר אתה תלחץ על לחצן הוספת התגובה.
הוא יקפוץ בDIV גבוה יותר משאר העמוד.

הבעייה שלי עכשיו היא רק ההתעסקות עם הJS.
כיצד להגדיר לתיבה לשלוח את התוכן המתאים ללחצן שלחצת עליו בעזרת JS.

אפשר ללחוץ על אחד מלחצני התגובה ולראות שקופצת הודעה.

הבעייה היא שההודעה קופצץ בגובה 0 של העמוד.
איך אני מקבל בJS את הגובה העכשווי של העמוד. ? כלומר אם אני גולל למטה 300 פיקסל את העמוד אני יקבל 300 ??

ציטוט:

במקור נכתב על ידי fcf הבעייה היא שההודעה קופצץ בגובה 0 של העמוד. איך אני מקבל בJS את הגובה העכשווי של העמוד. ? כלומר אם אני גולל למטה 300 פיקסל את העמוד אני יקבל 300 ??

http://www.quirksmode.org/dom/w3c_cssom.html

טעיתי בניסוח השאלה. אני רוצה לקבל את זה בCSS, לא בJS.

ראיתי שזה גם לא עובד באקספלורר לפי מה שהם כותבים.

קוד PHP:

 window.screenY 


זה הגובה בJS. אני צריך להגדיר TOP בCSS.

ב-CSS אני לא מצליח לחשוב על דרך עכשיו לפיתרון.

מה שאתה מחפש ב-JS זה לא screenY או screenX, אלא scrollLeft and scrollTop (אם הבנתי נכון)

אוקי, תודה. לא עובד.
זו הפונקצייה שפותחת את ההודעה הקופצת (בנויה משני DIVים)
היא אמורה גם לקבוע את המיקום בציר Y והיא לא קובעת אותו. היא מחרבשת מיקום שגוי

קוד PHP:

 function showhideform(id)
{
          var container = document.getElementById("top1");
          container.style.display = (container.style.display == "block")?"none":"block";  
          container.style.top = screen.scrollTop;
           var container = document.getElementById("top2");
          container.style.display = (container.style.display == "block")?"none":"block";  
          container.style.top = screen.scrollTop;
} 


scrollLeft and scrollTop שייכים לאלמנט HTML, ולא למסך (screen).

לכן יהיה נכון יותר לכתוב:

קוד:

document.scrollTop

תראה דוגמא פה:
http://www.quirksmode.org/dom/tests...dimensions.html

גם ככה לא עובד.
חבל שבדוגמא הם לא מציגים קוד מקור. גם בצפייה בקוד מקור לא מוצג קוד הJS... הם לוקחים את זה מקובץ נפרד.

בקיצור. גם ככה זה לא עובד.
המטרה היא ליצור DIV עליון בגודל 100%*100% שיהיה הרקע חצי שקוף ומעליו DIV ממורכז שיהיה תיבת התוכן העשיר.

זה הקוד להפעלה:

קוד PHP:

 function showhideform(id)
{
          var container = document.getElementById("top1");
          container.style.display = (container.style.display == "block")?"none":"block";  
          container.style.top = document.scrollTop;
           var container = document.getElementById("top2");
          container.style.display = (container.style.display == "block")?"none":"block";  
          container.style.top = document.scrollTop;
} 


זה התוכן הקופץ:

קוד PHP:

 echo"


<div style=\"position:absolute;left:0;width:100%;height:100%;z-index=20;background-Color:#000000;display:none;opacity:.50;filter: alpha(opacity=50); -moz-opacity: 0.5;\" name=\"top1\" id=\"top1\" >
<table style=\"height:100%;width:100%;\"><tr><td></td></tr></table>
</div>

<div style=\"position:absolute;left:0;width:100%;height:100%;z-index=30;display:none;\" name=\"top2\" id=\"top2\">
<table style=\"height:100%;width:1;\" align=\"center\"><tr><td valign=\"center\">

<table width=\"1\" align=\"center\" border=\"1\" style=\"border-collapse: collapse;\" bordercolor=\"#C4C4C4\">

<tr><td>
";
if($username!="")
{
echo "
<form method=\"post\" action=\"index.php?page=sendpost\">
<center><textarea name=\"text\">הכנס כאן את תוכן התגובה שלך</textarea></center>

<input type=\"hidden\" value=\"$level\" name=\"level\">
<input type=\"hidden\" value=\"$revpost\" name=\"revpost\">
<input type=\"hidden\" value=\"$guide_id\" name=\"guide_id\">


<br>
<center><input type=\"submit\" value=\"הוסף את תגובתך\">&nbsp;<input type=\"button\" onClick=\"closetop()\" value=\"סגור\"></center>
<br>
</form>
";
}
echo"
</td></tr>
</table>

</td></tr></table>
</div>

"; 


משום מה, הכול מופיע במיקום לא נכון,בתחתית העמוד.
עריכה: באקספלורר כלום לא קורה !

עריכה: המיקום שהתוכן הקופץ מופיע בו הוא המיקום שבו הוא יושב בעמוד, כאילו הוא בכלל לא בZ-INDEX גבוה.

http://uzone.co.il/index.php?page=guide&id=126
(לחצו למטה על "הוספת תגובה" כדי לראות)

עשיתי משהו שדומה ברעיונו לדבר שאתה רוצה לבצע.
אציג לך את הקוד שלי, ותנסה לפיו לבנות את מה שאתה רוצה.

קוד ב-JS, של החלון השקוף למחצה המכסה את כל מסמך ה-HTML

קוד:

/*******************
*  JS Code
********************/
/* 
	*Description:
		Finds inner window's width & height.
		returns a [Width,Height] array.	 */
function wSize() /* 'w' stands for 'window' */
{
	return [
		(document.documentElement.clientWidth || document.body.clientWidth || window.innerWidth || 0),	/* return window's width */
		(document.documentElement.clientHeight || document.body.clientHeight || window.innerHeight || 0)	/* return window's height */
	          ];
}

		var WD = wSize();	// Inner window Dimensions
		var WS_Height = document.body.parentNode.scrollHeight > document.body.parentNode.offsetHeight
						?	document.body.parentNode.scrollHeight
						: 	(WD[1] > document.body.parentNode.offsetHeight
							? WD[1]
							: document.body.parentNode.offsetHeight );

		WS_Height = WS_Height > WD[1] ? WS_Height : WD[1];

		cancelClick = document.createElement('div');
		cancelClick.className = 'cancelClick';

		cancelClick.style.width = parseInt(document.body.offsetWidth) + 'px';
		cancelClick.style.height = WS_Height + 'px';

		document.body.appendChild(cancelClick);

והנה קוד ה-CSS של החלון:

קוד:

/*******************
*  CSS Code
********************/
.cancelClick
{
	background-color:black;/* A transparent value is NOT possible here. IE doesn't renders it well, and therefore the functionality is damaged*/
	filter: alpha(opacity=50);	/* For IE */
	opacity: 0.5;	/* For FF, Opera etc. */
	position: absolute;
	display:inline-block;
	top:0;
	left:0;
}

קוד ה-JS של האלמנט הממורכז (מעל לחלון השקוף למחצה):

קוד:

/*******************
*  JS Code
********************/
this.obj = document.createElement('div');

		// Center the element
		this.obj.style.top = WD[1]/2 + parseInt(document.body.parentNode.scrollTop) + 'px'; 
		this.obj.style.left = WD[0]/2 + 'px';

		this.obj.style.height = 0;
		this.obj.style.width = 0;

שים לב שאיפסתי את רוחבו וגובהו של האלמנט הממורכז, כך שאין לו רוחב וגובה כלל (לפחות בהתחלה). אצלי בקוד אח"כ הגדלתי את גובהו ורוחבו לגודל המקורי.
לכן בהתחשב בגודל של האלמנט שלך, תוסיף עוד פיקסלים לרוחב ולגובה ל- this.obj, שזה האלמנט הממורכז.

בנוסף שים לב שבקוד כתבתי this.obj בגלל שזה משתנה "מחלקה" ב-JS. תשנה את זה אצלך למשתנה "רגיל" אם תצטרך...

מצויין!
עובד, אפילו באקספלורר

הנה הקוד שלי:

קוד PHP:

 function showhideform(id)
{
          var container = document.getElementById("top1");
          container.style.display = (container.style.display == "block")?"none":"block";  
          container.style.top =  parseInt(document.body.parentNode.scrollTop) + 'px'; 

           var container = document.getElementById("top2");
          container.style.display = (container.style.display == "block")?"none":"block";  
          container.style.top =  parseInt(document.body.parentNode.scrollTop) + 'px'; 

} 


עכשיו הקטע היותר מסובך בשבילי הוא כיצד לשלוח את הטופס. אני צריך לשלוח משתנה שילקח מJS.
המשתנה ישלח בטופס ע"י INPUT בצורת HIDDEN
כל לחיצה על לחצן מסויים אמורה לשלוח משתנה מסויים שיגדיר את עומק התגובה ביחס לעץ התגובות. אין לי ממש מושג איך לעשות גם את זה .

ראו כאן למשל: http://uzone.co.il/index.php?page=guide&id=34

יש שלוש תגובות, וארבעה לחצני תגובה (לחצן להגיב לכל תגובה + תגובת מפתח)
עם כל לחיצה על לחצן מסויים אני אמור לשלוח משתנה אחר בצורת HIDDEN.

תודה לכולם ובעיקר לDCD

שמח שעובד
אני מתאים את הקוד שלי לכל הדפדפנים ה"גדולים", ולכן זה היה חייב לעבוד גם ב-IE 6/7 .
(שים לב שלפחות ב-IE6, החלון\div שמכסה את כל אתרך, לא יוכל לכסות תיבת select, בגלל הבאג הידוע ב-IE6... אולי יש אותו ב-IE7, לא בטוח)

ציטוט:

עכשיו הקטע היותר מסובך בשבילי הוא כיצד לשלוח את הטופס. אני צריך לשלוח משתנה שילקח מJS. המשתנה ישלח בטופס ע"י INPUT בצורת HIDDEN כל לחיצה על לחצן מסויים אמורה לשלוח משתנה מסויים שיגדיר את עומק התגובה ביחס לעץ התגובות. אין לי ממש מושג איך לעשות גם את זה .

זה החלק הכי קל!
אתן לך דוגמא ליישום.
לכל האלמנטים של ה-input עם הלחצן של הוספת תגובה, תוסיף פונקציה הפועלת באירוע onclick, כאשר יש לה פרמטר אחד והוא מספר הזהות (id) של התגובה. במידה ולתגובה אין מספר זהות, ערך הפרמטר יהיה 0 (שאז התגובה תהיה להודעה הראשית והראשונה ב"אשכול").
הפונקציה הזו תשנה את ערך מאפיין ה-value של שדה input מסוג hidden הנמצא בין תגי ה-form. שים לב שמספיק רק שדה אחד כזה! אל תיצור X שדות כמספר התגובות בעמוד...
לפי ערך ה-value של שדה ה-input מסוג ה-hidden תוכל לדעת לאיזו תגובה הגיבו.

את התיאוריה גם אני הבנתי.

מה אני אמור לכתוב בתוך הvalue ? איך אני בעצם שולח את משתנה הJS לתוך הVALUE?

אני מתעסק בעיקר עם צד שרת ולכן קשה לי לקלוט את כל הקטע שבו הקוד רץ בדפדפן.

אהה טוב אראה לך את הדרך הפשוטה ביותר כדי להקל עליך.

קוד:

<!-- HTML CODE -->

<form ...><div><!--div tag for XHTML Strict 1.0 compatibility -->
<input type="hidden" name="respond_to" id="Res" value="0" />

<!-- Start comments section -->

<!-- Comment id:1 -->
<div>Bla bla bla... this is a comment</div>
<input type="button" value="הוסף תגובה" onlick="respond_to(1)" />

<!-- Comment id:2 -->
<div>Bla bla bla... this is a comment</div>
<input type="button" value="הוסף תגובה" onlick="respond_to(2)"  />

<!-- Comment id:.. -->
<!-- etc... -->

</div></form>

<!-- JS CODE -->
<script type="text/javascript">
function respond_to(comment_id)
{
   if (comment_id) // if comment_id != 0
         document.getElementById('Res').value = comment_id;
}
</script>

ההצבה של המספרים בקריאה לפונקציה respond_to תתבצע ע"י צד השרת, שבאמצעות לולאת while עובר על התגובות, ויש לו את מספרי הזהות של כל תגובה.

כלומר:

קוד PHP:

 // The PHP code
while($comment = mysql_fetch_array($resource))
{
   echo '<!-- Comment id:',$comment['comment_id'],' -->
<div>',$comment['comment_content'],'</div>
<input type="button" value="הוסף תגובה" onlick="respond_to(',$comment['comment_id'],')" />';
} 


---------------------

יש דרך אחרת, כללית, נוחה יותר ומתאימה להיבט ה-XML'לי, ע"י תפיסת אלמנט מסוים בעזרת getElementsByTagName וסינון האלמנטים בעזרת מאפיין class מתאים, כאשר מאפיין ה-class מעיד על תפקיד אלמנט ה-input (אם הוא נועד לקביעת ערך ה-value של ה-input מסוג ה-hidden באירוע onclick). בתהליך הסינון אתה קובע אירוע onclick מתאים לכל אלמנט, שזהו האירוע בפונקציית respond_to הנ"ל.

עובד ! תודה על כל העזרה ! .. מה הייתי עושה בלעדיך ..!?!?

נעזר בחברי הפורום האחרים

קודם הכנסת תוכן ממשתנה JS לתוך השדה INPUT...
עכשיו אני רוצה להכניס תוכן ממשתנה כזה לתוך תוכן של textarea אבל לשדה textarea אין פרמטר value. את התוכן משניסים בין שני תגי הteatarea. מה ניתן לעשות במקרה כזה ?

נעזרים ב-innerHTML

לדוגמא, קוד JS

קוד:

// JS CODE

document.getElementById('a_textarea_id').innerHTML   = 'Text! <br /> HTML CODE NOT
 ALLOWED HERE! Please filter the HTML code via PHP before inserting it. ';

תראה פה http://www.quirksmode.org/dom/w3c_html.html על innerHTML

עכשיו תוסיף fade מגניב

נחמד
אבל זה עושה לי FADE עד לשקיפות 100%
למרות ששיניתי את הקבועים ל50

http://uzone.co.il/index.php?page=guide&id=130
תלחץ על התגובה. אפשר לראות את הבעייה, זה נהיה שחור לגמרי

עריכה: הוספתי לפונק' שלך תנאי IF שכל עוד השקיפות קטנה מחמישים אחוז הוא מעלה אותה. אחרת הוא לא מבצע כלום. וזה עובד....

סבבה.. קצת פאק בייצור הייתי צריך את המחלקה רק בשביל שהיא תעבוד מ-0 עד 100.

בכל מקרה, שים את הקרדיט מעל לקוד