myfaces-dev mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From "Mark Li (JIRA)" <...@myfaces.apache.org>
Subject [jira] Issue Comment Edited: (MYFACES-2640) (JSF.js) Ajax Render component problem, replace with whole fragment not one element.
Date Wed, 05 May 2010 01:18:02 GMT

    [ https://issues.apache.org/jira/browse/MYFACES-2640?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=12864086#action_12864086
] 

Mark Li edited comment on MYFACES-2640 at 5/4/10 9:17 PM:
----------------------------------------------------------

in practice, "<h:panelGroup id="myDialog_placeHolder"> " will not work, because i want
to render the content during it display. render these will lead dialog disappear. and $("#myDialog").dialog()
should has autopen:false option, use outside html element to show it.

further, i should explain my code, 
I have my own component composite tools. it is like facelets, lxht:component is like ui:omponent,
lxht:insert is like ui:insert, but my tools can run much more faster .

the example is code for a Test Component,   

<lxht:component > 
<div id="#{clientId}"> 
     <div><lxht:insert/></div> 
    <script> $('#{clientId}').dialog({autoOpen:false}); </script>	
</div> 
</lxht:component> 

#clientId is a variable present uicompoent.getClientId(context);

this will produces html code (if clientid is j_test, sub component children is <h:form>....</h:form>
):

<div id="j_test" >
   div><h:form>....</h:form></div>
<script>$('#j_test').dialog({autoOpen:false});</script>
</div>

in your code, you use two ui component h:panelGroup, but in my case, i only want to use one,
my component 'test'.

so the code in .jspx file is simpler

<lxhs:test id="a"> 
<h:form>....</h:form>
</lxhs:test> 
<input type="button" value="show dialog" onclick="jQuery(document.getElementById('a')).dialog('open');"/>


only one component here, lxhs:test.

I write some component from scratch, because I want to keep every thing simple. i really like
js component framework, i can put a lot thing in one component, 

at first, i use facelets to do this, but after some month use, I find facelets is not good
enough for me,  heavy component tree, must have client id etc. so I design my own component
tools, it just wrap a bunch of html code into one jsf component like the example above. i
name it facekit :)

I want you understand my thought. keep everything fast, simple,  

therefore i write the customer component test, put every thing in jsf component. keep .jspx
file simpler. is that the jsf purpose?

in the case, the flexible of ajax is very very important, because when you put every thing
in ONE component, a lot issues will appear

further,yes, a well designed component should always be wrapped into a root element.  but
flexibility somehow is important too.


a lot of thanks for your patience. 


      was (Author: puddlor):
    in practice, "<h:panelGroup id="myDialog_placeHolder"> " will not work, because
i want to render the content during it display. render these will lead dialog disappear. and
$("#myDialog").dialog() should has autopen:false option, use outside html element to show
it.

further, i should explain my code, 
I have my own component composite tools. it is like facelets, lxht:component like ui:omponent,
lxht:insert like ui:insert, but my tools can run much more faster .

the example is code for a Test Component,   

<lxht:component > 
<div id="#{clientId}"> 
     <div><lxht:insert/></div> 
    <script> $('#{clientId}').dialog({autoOpen:false}); </script>	
</div> 
</lxht:component> 

#clientId is a variable present uicompoent.getClientId(context);

this will produces html code (if clientid is j_test, sub component children is <h:form>....</h:form>
):

<div id="j_test" >
   div><h:form>....</h:form></div>
<script>$('#j_test').dialog({autoOpen:false});</script>
</div>

in your code, you use two ui component h:panelGroup, but in my case, i only want to use one,
my component 'test'.

so the code in .jspx file is simpler

<lxhs:test id="a"> 
<h:form>....</h:form>
</lxhs:test> 
<input type="button" value="show dialog" onclick="jQuery(document.getElementById('a')).dialog('open');"/>


only one component here, lxhs:test.

I write some component from scratch, because I want to keep every thing simple. i really like
js component framework, i can put a lot thing in one component, 

at first, i use facelets to do this, but after some month use, I find facelets is not good
enough for me,  heavy component tree, must have client id etc. so I design my own component
tools, it just wrap a bunch of html code into one jsf component like the example above. i
name it facekit :)

I want you understand my thought. keep everything fast, simple,  

therefore i write the customer component test, put every thing in jsf component. keep .jspx
file simpler. is that the jsf purpose?

in the case, the flexible of ajax is very very important, because when you put every thing
in ONE component, a lot issues will appear

further,yes, a well designed component should always be wrapped into a root element.  but
flexibility somehow is important too.


a lot of thanks for your patience. 

  
> (JSF.js) Ajax Render component problem, replace with whole fragment not one element.
> ------------------------------------------------------------------------------------
>
>                 Key: MYFACES-2640
>                 URL: https://issues.apache.org/jira/browse/MYFACES-2640
>             Project: MyFaces Core
>          Issue Type: Bug
>          Components: JSR-314
>    Affects Versions: 2.0.0-beta-3
>         Environment: tomcat 6.0.20 java (mac os x )
>            Reporter: Mark Li
>             Fix For: 2.0.1-SNAPSHOT
>
>   Original Estimate: 4h
>  Remaining Estimate: 4h
>
> after ajax submit, jsf.js will re-render some element depending on jsf.ajax.request({render:"
some elements "});
> but this js code will cause some problem.
> jsf.js:
> myfaces._impl._util._Utils.replaceHtmlItem = function (request, context, itemIdToReplace,
newTag, form) {
> ......
>                     var fragment = range.createContextualFragment(newTag);
>                     evalNode = item.parentNode.replaceChild(fragment, item)
> .....
> }
> sometime fragment will has more than one childNodes, or the childNode not has clientId,
but the childNode of childNode has clientId.
> this will cause html unstable.
> Please fix it.
> this is my suggestion:
> myfaces._impl._util._Utils.replaceHtmlItem = function (request, context, itemIdToReplace,
newTag, form) {
>            .............
>               Orginal:
>                     var fragment = range.createContextualFragment(newTag);
>                     evalNode = item.parentNode.replaceChild(fragment, item)
>               fix:
>                     var fragment = range.createContextualFragment(newTag);
>                     var replaceItem = myfaces._impl._util._Utils.findHtmlItemFromFragment(fragment,
itemIdToReplace);
>                     if(replaceItem == null)replaceItem = fragment;
>                     evalNode = item.parentNode.replaceChild(replaceItem, item)
>        ..................
> }
>     myfaces._impl._util._Utils.findHtmlItemFromFragment = function(fragment, itemId){
>     	if(fragment.childNodes == null)
>     		return null;
>     	for(var i = 0; i < fragment.childNodes.length ; i++ ){
>     		var c = fragment.childNodes[i];
>     		if(c.id == itemId)
>     			return c;
>     	}
>     	for(var i = 0; i < fragment.childNodes.length ; i++ ){
>     		var c = fragment.childNodes[i];
>     		var item = myfaces._impl._util._Utils.findHtmlItemFromFragment(c, itemId);
>     		if(item != null)
>     			return item;
>     	}
>     	return null;
>     };

-- 
This message is automatically generated by JIRA.
-
You can reply to this email to add a comment to the issue online.


Mime
View raw message