We Keep Coding

page in jquery dialog box

I have dataTable which last column for edit. I have a separate page for edit form. what i want is when edit link is clicked open that page in a jQuery dialog box and submit data.

The correct way to solve this problem
Assuming that you want a popup or a more specific term modal to edit the form, you should not have a separate html view for that but actually make a general form and post data using ajax. Creating a separate page defeats that purpose.
Now assuming that you still want to have a separate page for that. The modal should be like
<div class="modal">
<iframe src="" id="frameSrc">
</iframe>
</div>
where the src contains the url of the page that you want to open, i am guessing from the href. So here is how you would do that in javascript
$(this).on("click", function () {
var editUri = $this.attr('href');
document.getElementById('frameSrc').src = editUri;
});
The javascript will get the url from href and substitute the src in iframe tag in modal.
Hope this helps..

you can do this without alert and you don't need send href to jquery
use fadeIn and some style to make it.
$('a#login').click(function(){
$("#bgstyle").fadeIn('slow');
$('form').fadeIn('slow');
})
Fiddle DEMO
hope this help you
anyway if i wanna do this i prefer to use bootstrap modal.

Prevent user from submit button click

I have got one Kendo UI dropdown box and combobox both are cascading and loading items from DB... and then few more textbox controls and then submit button also....
I made required validation for two textboxes and dropdownList and we can edit items that we are selected in combobox(we can remove also). Some times user clicks the submit button with out properly loading the items in Combobox then I am getting error like Required validation error ....
Is there any way to prevent the user from button click until the all the controls are fully loaded ...
I tried two ways ..
Approach 1 : i have put button property as hidden and then in combobox Databound event made visible the button ... But this approach didn't work..
Approach 2 :
I have tried the suggestions given in this link
$("#submit").prop("disabled", false)
this approach didn't worked for me..
Is there any other approach to prevent user from clicking the submit button until all controls are loaded...
Many thanks in advance...

You can do this:
<input type='submit' id='submit' value='submit' disabled />
<!--disable the button on default-->
and add this js:
$(window).load(function(){
$("#submit").prop("disabled", false); // enable it when page loaded.
});
this solution requires jquery.

On some projects i've used the css visibility property to hide show elements at appropriate times:
http://www.w3schools.com/css/css_display_visibility.asp
This might be what you want.

A display:none style until validation doesn't work for you?
$("#submit").css("display", none)
or
$("#submit").hide()

Using jQuery to hide drop-down, but it fails

There are two drop-downs i'm using in my document. One is visible, one i have to hide. Below is the script I have used to hide the drop-down:
<script src="http://code.jquery.com/jquery.min.js"></script>
<script>
$(document).ready(function() {
$('span[ds="Product Plan Type"]').css('visibility', 'hidden');
});
</script>
Using the above code: initially the drop-down disappears, but if another drop-down is used to select any other option, when processed for that, the page refreshes and shows the drop-down back.
Could anyone suggest something?

if your second drop down is not required during first load then you can set them hidden in code itlsef like
<asp:DropDownList runat="server" style="visibility:hidden">
</asp:DropDownList>
now as per your statement second drop down get filled base on first value selected (during page load)
so you can place javascript code where you can check if value =Product Plan Type
then you can how second drop down by javascript or you can do that using server side as well

use css display on element which you have hide
style="display:none"

How to make disappear a button in HTML?

I'm trying to hide a button on a form with the following code:
$('#ButtonID').hide();
document.getElementById('ButtonID').style.visibility = 'hidden';
But the button is still show in form. I need to know how to make it disappear?

you must specify whether you want to hide it or completely remove it from the flow. when you hide it, it still occupies its position and it just simply is hidden but when you set display:none it will be removed from page.
this is true
document.getElementById('ButtonID').style.visibility = 'hidden';
but it works on some browsers you must use this as well
document.getElementById('ButtonID').setAttribute("style","visibility:hidden");

check this out
http://jsfiddle.net/JPmhs/
JavaScript code should be
document.getElementById("toggle").style.visibility="hidden";
HTML
<form id="formvisiblity">
<input id="toggle" type="submit" text="submit" name="accept"/>
</form>
To toggle when clicked
onclick="function()" attribute will toggle on click

Sounds like you want $('#ButtonID').remove();

use the following jquery code:
----------
$("#toggle").attr("style","display:none");
JavaScript use following code:
----------
document.getElementById("toggle").style.display="none";

styling loaded content jquerymobile

i am working on asp.net page with jquery mobile 1.3 I am generating asp.net checkbox and label controls using vb. then i am using java script to converting the asp label to label. all the code looks fine but my control not being style (jquerymobile). so after my page load and java script that what i get.
<input id="ContentPlaceHolder1_chkbox2" type="checkbox"name="ctl00$ContentPlaceHolder1$chkbox2">
<label for="ContentPlaceHolder1_chkbox2">YES</label>
but not styled as jquery mobile check boxes how can i style the dynamic controls.
I tried:
$('#page1').trigger('create');`
$('#page1').page();
nothing work. please help Thanks

Updated answer
To change text of type=checkbox or type=radio:
$('label[for=name]').find('span.ui-btn-text').text('New Text');
Demo includes:
Change text
Add/create new checkbox, using .checkboxradio().trigger('create');
Dynamically 'Check/Uncheck' checkbox, using .prop('check', true); and .checkboxradio('refresh);
Refresh checkbox or radio buttons this way
$('[type=checkbox]').checkboxradio('refresh')