8 Replies - 5743 Views - Last Post: 24 May 2011 - 10:11 AM

#1 hockey97  Icon User is offline

  • D.I.C Regular

Reputation: -77
  • View blog
  • Posts: 300
  • Joined: 25-September 08

How to use Loops to generate data?

Posted 21 May 2011 - 12:03 AM

Hi, I need to generate divs and have them wrap around all inputs elements on my website.

I also want each individual div that gets wrapped to be the handler for each input element.

So if I have 7 input elements then I should have 7 divs wrapped around each input.

Now comes the problem... I need to write the jquery code so I can make each div be it's own handler for their own input.

so the individual 7 divs need to be the 7 individual inputs handler.

So that each input is draggable by using the div to drag the handler.

any ideas how to do this?

Or any ideas on a work around to make input buttons draggable???


Thank You For Your Time. :detective:

This post has been edited by hockey97: 21 May 2011 - 02:11 AM


Is This A Good Question/Topic? 0
  • +

Replies To: How to use Loops to generate data?

#2 Asusultra  Icon User is offline

  • New D.I.C Head
  • member icon

Reputation: 7
  • View blog
  • Posts: 39
  • Joined: 24-March 09

Re: How to use Loops to generate data?

Posted 21 May 2011 - 09:08 AM

Your post's title and your post's content...seem to conflict tremendously.
Was This Post Helpful? 0
  • +
  • -

#3 Asusultra  Icon User is offline

  • New D.I.C Head
  • member icon

Reputation: 7
  • View blog
  • Posts: 39
  • Joined: 24-March 09

Re: How to use Loops to generate data?

Posted 21 May 2011 - 09:26 AM

Quote

I need to generate divs and have them wrap around all inputs elements on my website.


I would suggest looking at this: .each() and .wrap()

you can get all the inputs on your page with selector: (':input')

investigation is the first step in solving a problem :)
Was This Post Helpful? 1
  • +
  • -

#4 Jstall  Icon User is offline

  • Lurker
  • member icon

Reputation: 434
  • View blog
  • Posts: 1,042
  • Joined: 08-March 09

Re: How to use Loops to generate data?

Posted 22 May 2011 - 12:14 PM

jQuery UI supplies the draggable interaction. It sounds like it could suit your needs.
Was This Post Helpful? 0
  • +
  • -

#5 hockey97  Icon User is offline

  • D.I.C Regular

Reputation: -77
  • View blog
  • Posts: 300
  • Joined: 25-September 08

Re: How to use Loops to generate data?

Posted 23 May 2011 - 12:01 AM

View PostJstall, on 22 May 2011 - 01:14 PM, said:

jQuery UI supplies the draggable interaction. It sounds like it could suit your needs.


ya, I am using it currently.

The problem is the inputs. I have to use a div. So I wrap a div to each input.

The problem is that it loses it's position. Kinda offsets.

I made a gui that you can move elements on a page and save it.

Now lets say you have 8 inputs and moved just 3 and then hit the saved button.

The 8 total inputs will show it as it moved. Because when I wrap the 8 divs on the fly around 8 inputs. It offsets the position.

I also have to take exact same css values... when I add the divs I need to make sure the inputs can have exact same css values. When they are inside the div I made the div the same size of the input value but added like 20 or 30px to the height. So when I save anything. I would want to modify their new css value by subtracting 20 or 30 px. that way I will get an accurate css value for the input element.

In the main html code I don't have divs around the input elements.
yet, I add them later with jquery. So when I do this. I have to set the input elments css values to 10 or 20 because it's now inside a div. The div itself supposed to use the input values css files before I set the input elements to 20 or 30px on position.

any ideas of how to implement adding divs on the fly and figure outing the offsets in the css values?

I want the elements to sit where they were placed in the start. Don't move at all. That way if your in the edit mode and didn't change a thing but hit the save button. I don't want to see the elements move or saved in their offset moved position.Even though the user themselves didn't move the elements at all just that when I add the divs wrapped around the inputs it kinda offset from original position.
Was This Post Helpful? 0
  • +
  • -

#6 Asusultra  Icon User is offline

  • New D.I.C Head
  • member icon

Reputation: 7
  • View blog
  • Posts: 39
  • Joined: 24-March 09

Re: How to use Loops to generate data?

Posted 23 May 2011 - 03:55 PM

WOW..confusing. anyhoo :)

When exactly are you wrapping the input elements with divs? -before/after save?

If you automatically do it after the save, you can put a condition to only add the divs if the input changed.

Now, for the issue of the offset css:
Do you know "how" it offsets? as in, does it become too high, too low, too far to the left/right, NE, SSE, etc ;)

Also, do you know by how much it offsets? -how many pixels?

Is it a consistent offset? -as in, is it always (for example) 3 pixels to the left, or 4px too high, etc.


Thank you in advance for the additional info. This will help tremendously :)

This post has been edited by Asusultra: 23 May 2011 - 03:55 PM

Was This Post Helpful? 0
  • +
  • -

#7 hockey97  Icon User is offline

  • D.I.C Regular

Reputation: -77
  • View blog
  • Posts: 300
  • Joined: 25-September 08

Re: How to use Loops to generate data?

Posted 23 May 2011 - 07:05 PM

View PostAsusultra, on 23 May 2011 - 04:55 PM, said:

WOW..confusing. anyhoo :)

When exactly are you wrapping the input elements with divs? -before/after save?

If you automatically do it after the save, you can put a condition to only add the divs if the input changed.

Now, for the issue of the offset css:
Do you know "how" it offsets? as in, does it become too high, too low, too far to the left/right, NE, SSE, etc ;)

Also, do you know by how much it offsets? -how many pixels?

Is it a consistent offset? -as in, is it always (for example) 3 pixels to the left, or 4px too high, etc.


Thank you in advance for the additional info. This will help tremendously :)



I add the divs before the save. I have a edit mode. Where when your in this mode you can drag all elements but for inputs I have to wrap the divs around those inputs. To make them drawable. But when I add the divs they get the same values as the inputs but I add 20 or 30 pixels to the height to make the div be a handler. So I have the math where when you click save the save runs a java function where it would grab the css values of the div but subtract those 20 or 30 pixels I added. Now when these divs are added to the inputs they offset in a north west direction of the webpage. Now each input have different offsets and go in different directions. I got arrow buttons that their are 4 total 2 ends up offsetting down straight down south where as the arrows displayed on the east of the webpage ends up going far east where the website has a horizontal scroll that goes far off the page.
Was This Post Helpful? 0
  • +
  • -

#8 Jstall  Icon User is offline

  • Lurker
  • member icon

Reputation: 434
  • View blog
  • Posts: 1,042
  • Joined: 08-March 09

Re: How to use Loops to generate data?

Posted 24 May 2011 - 08:19 AM

Have you considered using .addClass and .removeClass() ?

You could set the various css values of the class to make the positions the same in both edit and non-edit modes. So use addClass to add a class to your divs and make a CSS selector for them. You could also make a selector for your inputs when they inside a div of class editable(or whatever you wanted to call it).
Was This Post Helpful? 1
  • +
  • -

#9 Asusultra  Icon User is offline

  • New D.I.C Head
  • member icon

Reputation: 7
  • View blog
  • Posts: 39
  • Joined: 24-March 09

Re: How to use Loops to generate data?

Posted 24 May 2011 - 10:11 AM

View PostJstall, on 24 May 2011 - 10:19 AM, said:

Have you considered using .addClass and .removeClass() ?

You could set the various css values of the class to make the positions the same in both edit and non-edit modes. So use addClass to add a class to your divs and make a CSS selector for them. You could also make a selector for your inputs when they inside a div of class editable(or whatever you wanted to call it).


That was going to be my suggestion if the offset amounts were consistent (which would makes sense if they are). Otherwise, more digging is needed to find a pattern.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1