0

I've already implemented the solution from How to set a dynamic height on content for each step? and it works great. However, this doesn't work when you are dynamically adding an element inside the step. For example, adding a row in a table dynamically via button, the height doesn't adjust automatically. I'm thinking to adjust the height dynamically when the button is click. Any suggestion on how to do this?

Community
  • 1
  • 1
Joe Raynes
  • 11
  • 4
  • What is the html code to work with? Do you have a fiddle? You could have the button click trigger an event/function in this function you can call the resize function. Or click on the button triggers resize directly. – Anima-t3d May 23 '15 at 15:26
  • yes but my problem is i dont know whats the resize function for the wizard step? i already tried the .height() but doesn't work. Sample code snippet. $("#btnAdd").click(function () { $(".wizard .content .body").height(500); }); – Joe Raynes May 24 '15 at 04:44
  • If you use [this example](http://jquery-steps.com/Examples#advanced-form) it has no classes `wizzard` `content` or `body` but instead use elements ` headerTag: "h3", bodyTag: "fieldset". If you use different code, please provide the html code. – Anima-t3d May 24 '15 at 08:05

2 Answers2

0

If you use this example it has no classes wizard content or body but instead use elements headerTag: "h3", bodyTag: "fieldset", so your example would then be 

$("#btnAdd").click(function () { 
  $("#example-advanced-form h3>fieldset").height(500); 
});
marc_s
  • 732,580
  • 175
  • 1,330
  • 1,459
Anima-t3d
  • 3,431
  • 6
  • 38
  • 56
  • It doesn't work. using .height() will just take effect after you go to the next step and then youll back to the previous step. – Joe Raynes May 24 '15 at 11:35
  • @JoeRaynes please edit [this fiddle](http://jsfiddle.net/t83L4xpd/) and click save, then put the link here so we can work from there. – Anima-t3d May 24 '15 at 12:25
  • Hi, thanks for the help. I've edited the fiddle already. Basically, im adding a dynamic element on the content. I want to adjust the height automatically. – Joe Raynes May 24 '15 at 13:05
  • @JoeRaynes you need to click save and paste the url here, so we can work from there. – Anima-t3d May 24 '15 at 20:50
0

In jquery.steps.css file,
just remove position: absolute.

.wizard > .content > .body
{
    float: left;
    /*position: absolute;*/ <== remove or comment this line
    width: 95%;
    height: 95%;
    padding: 2.5%;
}
Pars
  • 4,932
  • 10
  • 50
  • 88