Sign in to follow this  
Nanven

[web] JavaScript Problem

Recommended Posts

Okay, here's what I am trying to do. I am making a table, each cell has a div inside of it. The reason it has a div is because I want to be able to change the text inside of the cell dynamically. It's changing, but the problem is it stays on one line, and expands the cell, instead of wrapping down to the next line. Is there anyway to accomplish this through div or any other object?

Share this post


Link to post
Share on other sites
If you are using the innerHTML value, I don't think that's standard DOM stuff. But you may want to try changing some values on the div, like setting a fixed with and setting the wrap parameters (don't know them off the top).

Share this post


Link to post
Share on other sites
The best you'll get to wrapping in a non-IE browser is using the CSS Overflow property. IE has word-wrap, but I'm hesitant to recommend it as I tend to stick with standards. But then again, when it comes to javascript, the standards are even looser than CSS when it comes to IE.

As for setting the width of table cells, set the width of the cell (or column) either with CSS or the standard table width attribute. Remmeber, if you set a pixel width, the contents will automatically wrap to the next line.

Show us some code, it'll help me understand exactly what you want to do.

Share this post


Link to post
Share on other sites
Okay. I'm just messing around making an event calendar. I set it up like this, it's not the whole code, but ill try to give the things that matter.


var calendarMonth = new Date();
var monthLength = new Array([31],[28],[31],[30],[31],[30],[31],[31],[30],[31],[30],[31]);
if(calendarMonth.getYear() % [4] == [0]) {
monthLength[[1]] = [29];
}
var daysOfTheWeek = new Array("Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday");
var numberOfDays = monthLength[calendarMonth.getMonth()];
var events = new Array();

function setupCalendar() {
var currentDay = [0];
var numberDone = [0];
var dayOffset = getStartOffset();
numberDone = dayOffset;

document.write("<tr>");
document.write("<th width=[120]>Sunday</th>");
document.write("<th width=[120]>Monday</th>");
document.write("<th width=[120]>Tuesday</th>");
document.write("<th width=[120]>Wednesday</th>");
document.write("<th width=[120]>Thursday</th>");
document.write("<th width=[120]>Friday</th>");
document.write("<th width=[120]>Saturday</th>");
document.write("</tr>");

while(currentDay < numberOfDays) {
document.write("<tr>");
if(currentDay == [0]) {
for(var i = [0]; i < dayOffset; i++) {
document.write("<td></td>");
}
}
while(currentDay < numberOfDays && numberDone < [7]) {
currentDay++;
numberDone++;
document.write("<td valign=top>");
document.write(currentDay);
document.write("<div id = Day"+ currentDay +">"+ events[currentDay] +"</div>");
document.write("</td>");
}
numberDone = [0];
document.write("</tr>");
}
}



EDIT: For some reason it put [] around integers, those aren't REALLY there, so just ignore most of them, unless they are there because of an array.
Anyway, so each cell has a div that's set to the events array index of that day. Right now i'm just hard coding it, but I hope to eventually make it so events is getting the data from a database, but wanna make it look pretty first ;)

Share this post


Link to post
Share on other sites

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

Sign in to follow this